misformed

I have integrated scheduler in a page using jquery example
I have few tabs with jquery and one of them is the calendar
This is the code i use for tabs

The calendar is kind if misformed
The left vertical line left of time is not visible (No 3)
The header event is misplaced (No 2)
and the line below days continues out of calendar frame (No 1)

what should i look for?
any tips
Excuse me greek
thnx


Hello,
this usually happens when you have global ‘box-sizing:border-box’ setting on the page. Probably you are using a bootstrap
Try to add following css to the page:

[code].dhx_cal_navline div, .dhx_cal_header, .dhx_cal_header div, .dhx_cal_data div, .dhx_cal_light, .dhx_cal_light div {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}

.dhx_cal_light .dhx_cal_radio label{
margin-bottom: 0;
}

.dhx_cal_event div {
line-height: normal;
}[/code]

Aliaksandr thnx for your help

I didn’t see any difference applying these css
1is now a scroll bard and 3 i don’t mind much

I am most concern on the no 2.
When default view is week: When i switch to day view looks good, and then when i switch back to week view looks good too

When default view is day: i have the same problem. If i switch to week looks good, and if i switch back to day view looks good too. It looks like java problem

I just have this, as it is in the screenshot only, in first load of the page

Do you have any suggestion/tip what should i look for?

George

Hi,
sorry, i’ve misread your first question.
1-3 is a default style, scheduler don’t have outer borders. You can add them via css

.dhx_cal_container{ border-left: 1px solid #cecece; border-right: 1px solid #cecece; }

2 - probably the scheduler is rendered before other components are initialized. So it’s displayed size does not match the container element, untill you refresh the calendar(which is happening when you changing the view).
You can refresh calendar manually when everything is initialized with this line:

scheduler.setCurrentView();

borders worked fine

about the event view
I tried
scheduler.setCurrentView(new Date(),“week”);
and
scheduler.setCurrentView();
I tried to disable date mode in .myscheduler too
I tried with updateview also…

in several places, none worked

I use the jquery sample
so i have in
… misc scheduler parameters…
$(".myscheduler").dhx_scheduler({
xml_date:"%Y-%m-%d %H:%i",
date:new Date(),
mode:“week”,
first_hour:8,
last_hour:22,
start_on_monday:false
});
scheduler.load(“calendar/connector.php”);
var dp = new dataProcessor(“calendar/connector.php”);
dp.init(scheduler);
});

and in body

Hi,
do you have a possibility to provide us a link to an online demo to inspect the issue? In PM.

Sure,

I will install it on a public server later today and i will send you the link with PM

thnx

Hi,
thank you for the demo. It’s quite strange issue. Could you call the “scheduler.updateView()” method when the tab is switched? It will render events correctly. I still can’t see the cause of the initial weird render in the background tab…

I have tried this with

  • Ραντεβού
  • and
  • Ραντεβού
  • and

    but no results or even worse in some cases (grid was missing)