PDA

View Full Version : [CLOSED] CalendarPanel Issues



cleve
Jul 04, 2012, 2:36 PM
Hi, code first:




<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<script src="/scripts/ext/coolite.js" type="text/javascript"></script>
<script src="/scripts/ext/isscontrols.js" type="text/javascript"></script>
</head>
<body id="theBody">
<ext:ResourceManager ID="theManager" runat="server" IDMode="Inherit" Theme="Default"
EnableViewState="false" DisableViewState="true" ShowWarningOnAjaxFailure="false"
ScriptMode="Debug" />

<ext:CalendarPanel ID="cPanel"
runat="server" ActiveIndex="0" Height="400" Width="500"
Border="false">
<CalendarStore ID="CalendarStore1" runat="server" AutoLoad="false">
<Calendars>
<ext:CalendarModel CalendarId="1" Title="Home" />
<ext:CalendarModel CalendarId="2" Title="Work" />
<ext:CalendarModel CalendarId="3" Title="School" />
<ext:CalendarModel CalendarId="4" Title="Other" />
</Calendars>
</CalendarStore>
<EventStore ID="EventStore1" runat="server" AutoLoad="false">
<Parameters>
<ext:StoreParameter Name="id" Value="true" Mode="Raw" />
</Parameters>
<Listeners>
<Load Handler="a;" />
</Listeners>
</EventStore>
<MonthView ID="MonthView1"
runat="server"
ShowText="true"
ShowWeekLinks="true"
ShowWeekNumbers="true"
/>
<WeekView ID="WeekView1"
runat="server"
ShowText="true"
ShowWeekLinks="true"
ShowWeekNumbers="true"
/>
<DayView ID="DayView1"
runat="server"
ShowText="true"
ShowWeekLinks="true"
ShowWeekNumbers="true"
/>
<Listeners>
<ViewChange Handler="" />
<EventClick Handler="b;" />
<DayClick Handler="c;" />
<RangeSelect Handler="d;" />
<EventMove Handler="e;" />
<EventResize Handler="f;" />
</Listeners>
</ext:CalendarPanel>


<!-- Window -->
<ext:EventWindow
ID="EventEditWindow1"
runat="server"
Hidden="true"
CalendarStoreID="CalendarStore1">
<Listeners>
<EventAdd />
<EventUpdate />
<EditDetails />
<EventDelete />
</Listeners>
</ext:EventWindow>


<script language="javascript" type="text/javascript">

var testFunc = function () {
}


</script>
<form runat="server" id="theForm" />
</body>
</html>




An JS error occurs (of course it's happened in load listener). But I've set AutoLoad to false. Suppose it won't happen untill I call cPanel.eventStore.load() explicitly, So:
1. CalendarPanel.AutoLoad not work while set to false;
2. I found in the example page of CalendarPanel (remote_data), the code for JsonReader to parse EventModelCollection is like:




<EventStore ID="EventStore1" runat="server" NoMappings="true">
<Proxy>
<ext:AjaxProxy Url="../Shared/Code/RemoteService.asmx/GetEvents" Json="true">
<ActionMethods Read="POST" />
<Reader>
<ext:JsonReader Root="d" />
</Reader>
</ext:AjaxProxy>
</Proxy>
<Mappings>
<ext:ModelField Name="StartDate" Type="Date" DateFormat="M$" />
<ext:ModelField Name="EndDate" Type="Date" DateFormat="M$" />
</Mappings>
</EventStore>


The " Root='d' " property is bizarre and not used as conventional as the rest of the examples which use "data". Can you guys give me another example converting EventModelCollection.Seralize() to JSON format using "data" as the Root?

3. for EventModelCollection.Serialize(bool mapping): Can you guys enlighten about the argument put in "mapping" ? I compare JSON cook under the false and true and found different but with no clues. Also, if an example by extending the EventModel, e.g., adding more properties on model is highly appreciated. :)

Daniil
Jul 04, 2012, 4:35 PM
Hi,



1. CalendarPanel.AutoLoad not work while set to false;


The EventStore AutoLoad works. Just the initially active view causes a load request to be populated with the events for its current dates interval. For example, changing the current view date also causes a load request.

Replace the Load listener with:

<Load Handler="console.log('Load');" />


You will see the it is triggered twice with the default

AutoLoad="true"

1. An auto load request.
2. A load request initiated by the initially active view.

And once with

AutoLoad="false"

1. Just a load request initiated by the initially active view.



2. I found in the example page of CalendarPanel (remote_data), the code for JsonReader to parse EventModelCollection is like:




<EventStore ID="EventStore1" runat="server" NoMappings="true">
<Proxy>
<ext:AjaxProxy Url="../Shared/Code/RemoteService.asmx/GetEvents" Json="true">
<ActionMethods Read="POST" />
<Reader>
<ext:JsonReader Root="d" />
</Reader>
</ext:AjaxProxy>
</Proxy>
<Mappings>
<ext:ModelField Name="StartDate" Type="Date" DateFormat="M$" />
<ext:ModelField Name="EndDate" Type="Date" DateFormat="M$" />
</Mappings>
</EventStore>


The " Root='d' " property is bizarre and not used as conventional as the rest of the examples which use "data". Can you guys give me another example converting EventModelCollection.Seralize() to JSON format using "data" as the Root?


The "d" comes from the default ASP.NET serialization which is used in ASMX WebServices. For example, that "d" also appears here:
http://examples2.ext.net/#/GridPanel/Paging_and_Sorting/JSON_WebService/

For example, in the context of MVC and StoreResult as a response of the controller action the Root will be "data".



3. for EventModelCollection.Serialize(bool mapping): Can you guys enlighten about the argument put in "mapping" ? I compare JSON cook under the false and true and found different but with no clues.

It means this mapping:
http://docs.sencha.com/ext-js/4-1/#!/api/Ext.data.Field-cfg-mapping

Each EventStore ModelField has Name and Mapping.

So, the argument you asked is the option to get serialzation with or without mappings.

By default, the events are serialized with mappings, for example, here:
http://examples2.ext.net/#/Calendar/Overview/Basic/

Here the events comes from the WebService without mappings:
http://examples2.ext.net/#/Calendar/Overview/Remote_Data/

Therefore the EventStore is configured with

NoMappings="true"



Also, if an example by extending the EventModel, e.g., adding more properties on model is highly appreciated. :)

Here is the example for Ext.NET v1.
http://forums.ext.net/showthread.php?14093

It gives the key points to implement it in Ext.NET v2. The principle will be the same.

You might need to look at the Calendar JS sources.
<Ext.Net v2 sources root>\Ext.Net\Build\Ext.Net\ux\calendar\...

cleve
Jul 05, 2012, 1:48 AM
Thanks for all the information. It helps. :) BTW. is there any foreseeable possibilities that you guys will include Grantt and Scheduler as another UX in Ext.NET. They look not cheap at all.

Daniil
Jul 05, 2012, 6:24 AM
Glad to help.


is there any foreseeable possibilities that you guys will include Grantt and Scheduler as another UX in Ext.NET. They look not cheap at all.

Here is the related info.
http://forums.ext.net/showthread.php?19702&p=84928&viewfull=1#post84928