PDA

View Full Version : [CLOSED] [2.0] How to make the Weekly Calendar view Day Cells larger.



FVNoel
Sep 13, 2012, 4:49 PM
Hello,

I'm trying to use an Ext.CalendarPanel to display a calendar in which the user can select invervals of X minutes for appointments.

The problem is that if the time interval is something lower than half an hour, the Day cells are way too small (24 pixels), and the events overlap.

4773
I want to make the day cells larger so the events don't overlap, but I don't know how I can change the cell Height.

My code:



<%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Recursos/Masters/SiteBase.Master"
CodeBehind="Test2.aspx.vb" Inherits="Intranet.Test2" %>


<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<script type="text/javascript">
var toggleDD = function (calendarId) {
var monthView = Ext.getCmp(calendarId.replace('App.', '') + '-month'),
weekBdView = Ext.getCmp(calendarId.replace('App.', '') + '-week-bd'),
dayBdView = Ext.getCmp(calendarId.replace('App.', '') + '-day-bd'),
toggle = function (view) {
if (view != null) {
var dragZone = view.dragZone;
if (dragZone) {
if (dragZone.isLocked()) {
dragZone.unlock();
} else {
dragZone.lock();
}
} else {
view.on('afterrender', function () { this.dragZone.lock(); })
}
}
};
toggle(monthView);
toggle(weekBdView);
toggle(dayBdView);
}
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<ext:FormPanel runat="server" ID="pnlDiasSemana">
<Items>
<ext:CalendarPanel ID="CalendarPanel1" runat="server" Height="600" ShowDayView="false" ShowMonthView="false">
<EventStore runat="server" />
<Listeners>
<AfterRender Handler="toggleDD('#{CalendarPanel1}');" />
</Listeners>
<Buttons>
<ext:Button runat="server" Text="Toggle selectRange">
<Listeners>
<Click Handler="toggleDD('#{CalendarPanel1}');" />
</Listeners>
</ext:Button>
</Buttons>
<WeekView runat="server" />
<Listeners>
<EventClick Handler="
alert(record.data.EventId.toString());
" />
</Listeners>
</ext:CalendarPanel>
</Items>
</ext:FormPanel>
</asp:Content>

Daniil
Sep 13, 2012, 9:17 PM
Hi,

Unfortunately, the Calendar built in Ext.NET doesn't support such setting. You could try to override DayView sources. However, it can be difficult.

We are working on a separate Calendar Pro project. It should support this setting:
http://ext.ensible.com/deploy/dev/docs/source/Day.html#cfg-Extensible.calendar.view.Day-hourHeight

Some more information about Calendar Pro is here:
http://forums.ext.net/showthread.php?19702&p=84928&viewfull=1#post84928