Calendarlist with Remote Calendar

Report bugs for any Extensible Components

Calendarlist with Remote Calendar

Postby allendooog » Thu Jan 08, 2015 2:12 am

Hi.

I downloaded Extensible Calendar here http://ext.ensible.com/products/calendar/download/

I am using Remote Calendar based on the downloaded examples. When I included extensible.calendarlist in the items, the calendarlist is not showing completely unless I RESIZE the window OR when I SELECT different day from different month.

Please see attached files.
Attachments
Untitled1.png
Calendarlist collapsed when I resized the window
Untitled1.png (39.39 KiB) Viewed 12790 times
Untitled.png
Calendarlist not collapsing on first load
Untitled.png (38.83 KiB) Viewed 12794 times
allendooog
 
Posts: 4
Joined: Thu Jan 08, 2015 1:56 am

Re: Calendarlist with Remote Calendar

Postby allendooog » Tue Jan 20, 2015 1:27 am

anything??
allendooog
 
Posts: 4
Joined: Thu Jan 08, 2015 1:56 am

Re: Calendarlist with Remote Calendar

Postby brian.moeskau » Wed Jan 21, 2015 1:23 am

You didn't provide many details. What browser? Does that sidebar region have a layout, or is it customized in any way? I'm not able to reproduce in the default demo page.
User avatar
brian.moeskau
Site Admin
Site Admin
 
Posts: 1344
Joined: Sat Sep 18, 2010 5:00 pm
Location: Austin, Texas

Re: Calendarlist with Remote Calendar

Postby allendooog » Wed Jan 21, 2015 6:37 pm

I just added xtype: extensible.calendarlist below the datepicker. I am using the Remote Calendar included in the examples..

Tested in Chrome and IE.

The calendarlist is not showing properly as it should be unless i resize the window..

Ext.create('Ext.Viewport', {
layout: 'border',
renderTo: 'cal',
items: [{
id: 'app-header',
region: 'north',
height: 35,
border: false,
// contentEl: 'app-header-content'
},{
id: 'app-center',
title: '...', // will be updated to the current view's date range
region: 'center',
layout: 'border',
listeners: {
'afterrender': function(){
Ext.getCmp('app-center').header.addCls('app-center-header');
}
},
items: [{
id:'app-west',
region: 'west',
width: 179,
border: false,
items: [
{
xtype: 'datepicker',
id: 'app-nav-picker',
cls: 'ext-cal-nav-picker',
listeners: {
'select': {
fn: function(dp, dt){
Ext.getCmp('calendar-remote').setStartDate(dt);
},
scope: this
}
}
},{
xtype: 'extensible.calendarlist',
store: calendarStore,
border: false,
width: '100%',
autoHeight: true,
// region: 'west',
border: false,
width:178,
// layout: 'fit',
split: true,
}]
},{
xtype:'extensible.calendarpanel',
id: 'calendar-remote',
eventStore: eventStore,
calendarStore: calendarStore,
region:'center',
width: '100%',
height: '100%'
}
]
}]
});
allendooog
 
Posts: 4
Joined: Thu Jan 08, 2015 1:56 am

Re: Calendarlist with Remote Calendar

Postby brian.moeskau » Wed Jan 21, 2015 10:30 pm

What happens if you remove "autoHeight: true" ?
User avatar
brian.moeskau
Site Admin
Site Admin
 
Posts: 1344
Joined: Sat Sep 18, 2010 5:00 pm
Location: Austin, Texas

Re: Calendarlist with Remote Calendar

Postby allendooog » Mon Jan 26, 2015 12:40 am

Nothings happens. But when i set height to a fixed value, it shows. Unfortunately, i cant use a fixed height as I add new calendar dynamically.
allendooog
 
Posts: 4
Joined: Thu Jan 08, 2015 1:56 am

Re: Calendarlist with Remote Calendar

Postby darknod23 » Mon Jan 18, 2016 11:36 pm

i'd doing this to fix that:

setTimeout(function () { Ext.getCmp('yourCalendarListID).updateLayout(); }, 2000);

Actually the function updateLayout() fix that, after i trace down the collapsing function.
But i have place down updateLayout() function on the listeners 'afterrender' but still not working (because the component not finished render).
So i have to create delay timer then execute updateLayout() func.
Hope its get fixed properly.
Tested : chrome browser
darknod23
 
Posts: 3
Joined: Mon Jan 18, 2016 11:32 pm


Return to Bugs

Who is online

Users browsing this forum: No registered users and 2 guests

cron