PDA

View Full Version : Ext JS 3.3 Calendar and xhtml



Snaker
18 Nov 2010, 3:42 AM
Hi,

first a big thx for the Calendar App. But I have a Problem in the week/day view. The Problem is, that the Headers of the columns are missing. They are still in the sourcecode but I can not see the header. Problem is the 100% of table which do not work in a site with:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Can anyone help me?

Notice: Non XHTML is no solution

Thx Snaker

manube
22 Nov 2010, 6:59 AM
Hello,
I've got the same pb than you, did you manage to resolve it?
The calendar headers are ok in ie but not in firefox and opera (I don't test the other browsers).
Thanks

Edit:
I've modified calendar-all-debug.js to temporary fix this pb, line 244 :


Ext.calendar.BoxLayoutTemplate.superclass.constructor.call(this,
'<tpl for="weeks">',
'<div id="{[this.id]}-wk-{[xindex-1]}" class="ext-cal-wk-ct" style="top:{[this.getRowTop(xindex, xcount)]}%; height:{[this.getRowHeight(xcount)]};">',
weekLinkTpl,
'<table class="ext-cal-bg-tbl" cellpadding="0" cellspacing="0">',
'<tbody>',
'<tr>',
'<tpl for=".">',
'<td id="{[this.id]}-day-{date:date("Ymd")}" class="{cellCls}">&nbsp;</td>',
'</tpl>',
'</tr>',
'</tbody>',
'</table>',
'<table class="ext-cal-evt-tbl" cellpadding="0" cellspacing="0">',
'<tbody>',
'<tr>',
'<tpl for=".">',
'<td id="{[this.id]}-ev-day-{date:date("Ymd")}" class="{titleCls}"><div>{title}</div></td>',
'</tpl>',
'</tr>',
'</tbody>',
'</table>',
'</div>',
'</tpl>', {
getRowTop: function(i, ln){
return ((i-1)*(100/ln));
},
getRowHeight: function(ln){
if(ln>1)
return 100/ln+'%';
else
return '100px';
}
}
);

brian.moeskau
22 Nov 2010, 9:26 AM
Is this the same issue as discussed here (http://ext.ensible.com/forum/viewtopic.php?f=3&t=16)? I plan on looking into a proper fix for it at some point, not sure yet exactly what the issue is.

manube
23 Nov 2010, 5:33 AM
Hello,
Yes it looks to be the same issue (I'm using the same doc type definition).
The "bug" occurs also on opera 10.63 (Win XP).
I know my fix is not perfect but it seems to be OK for my needs.
Thanks!

brian.moeskau
23 Nov 2010, 6:39 AM
Opera on XP??? <shudder> ;)

brian.moeskau
2 Dec 2010, 11:57 AM
FYI, I am officially tracking this bug here (http://ext.ensible.com/forum/viewtopic.php?f=3&t=16) and it's currently slated to be fixed in my 1.1 release of Calendar Pro. Once it's resolved I'll post an official patch here.

brian.moeskau
26 Jan 2011, 2:56 PM
I think this should be resolved now. See details here (http://ext.ensible.com/forum/viewtopic.php?f=3&t=16&sid=cd03035d742a2f80e9a3f1a0987dddd3&start=10#p545), or just try out this override:


Ext.override(Ext.calendar.DayHeaderView, {
recalcHeaderBox : function(){
var tbl = this.el.child('.ext-cal-evt-tbl'),
h = tbl.getHeight();

this.el.setHeight(h+7);

// These should be auto-height, but since that does not work reliably
// across browser / doc type, we have to size them manually
this.el.child('.ext-cal-hd-ad-inner').setHeight(h+5);
this.el.child('.ext-cal-bg-tbl').setHeight(h+5);
}
});