This is a migrated thread and some comments may be shown as answers.

Customize the Advanced Form Template Error (object does not support this property or method.)

14 Answers 336 Views

Scheduler

This is a migrated thread and some comments may be shown as answers.

Karl asked on 20 Sep 2009, 02:25 PM

Hi,

I'm trying to follow this tutorial:-
http://www.telerik.com/help/aspnet-ajax/schedule_advancedformtemplate.html
Sample downloaded SchedulerCustomAdvancedFormQ2__SP1_2009.zip

I've created my own project etc and keep getting this error:-
object does not support this property or method.
When I debug it points to line 5?

    
                <script type="text/javascript">  
        
                    //<![CDATA[ 
        
                    function schedulerFormCreated(scheduler, eventArgs) { 
        
                        var mode = eventArgs.get_mode(); 
        
                        if (mode == Telerik.Web.UI.SchedulerFormMode.AdvancedInsert || 
        
                                mode == Telerik.Web.UI.SchedulerFormMode.AdvancedEdit) { 
        
                            // Initialize the client-side object for the advanced form 
        
                            var schedulerElement = scheduler.get_element(); 
        
                            var formElement = eventArgs.get_formElement(); 
        
                            var isModal = scheduler.get_advancedFormSettings().modal; 
        
                            var advancedTemplate = new window.SchedulerAdvancedTemplate(schedulerElement, formElement, isModal); 
        
                            advancedTemplate.initialize(); 
        
                            // Are we using Web Service data binding? 
        
                            if (!scheduler.get_webServiceSettings().get_isEmpty()) { 
        
                                // Populate the form with the appointment data 
        
                                var apt = eventArgs.get_appointment(); 
        
                                var isInsert = mode == Telerik.Web.UI.SchedulerFormMode.AdvancedInsert; 
        
                                var editSeries = eventArgs.get_editingRecurringSeries(); 
        
                                advancedTemplate.populate(apt, isInsert, editSeries); 
        
                            } 
        
                        } 
        
                    } 
        
                    //]]> 
        
                </script>

I've double checked my code etc and can't see what has gone wrong. When I click on recurrence nothing happens, the same error appears (when in debug mode).

I then went to the sample project and ran that and the same error occurs. Can any one help?

Many thanks

14 Answers, 1 is accepted

answered on 20 Sep 2009, 07:06 PM

Hi,

Sorted it, replaced the above script with this:-

    
            <script type="text/javascript">  
        
               //<![CDATA[ 
        
               function schedulerFormCreated(scheduler, eventArgs) { 
        
                   var $ = $telerik.$; 
        
                   var schedulerElement = scheduler.get_element(); 
        
                   var formElement = $("div.rsAdvancedEdit", schedulerElement); 
        
                   var isModal = scheduler.get_advancedFormSettings().modal; 
        
                   if (formElement.length == 1) { 
        
                       // Initialize the client-side object for the advanced form 
        
                       var advancedTemplate = new window.SchedulerAdvancedTemplate(schedulerElement, formElement[0], isModal); 
        
                       advancedTemplate.initialize(); 
        
                   } 
        
               } 
        
               //]]> 
        
            </script>

getting mixed up with documentation

answered on 23 Sep 2009, 09:08 AM

Hello Karl,

Actually, we discovered flaws with the schedulerFormCreated handler for the tutorial. Here is the most up-to-date code which we recommend you use:

    
             // Dictionary containing the advanced template client object  
        
                        // for a given RadScheduler instance (the control ID is used as key).  
        
                        var schedulerTemplates = {};  
        
                        function schedulerFormCreated(scheduler, eventArgs) {  
        
                            // Create a client-side object only for the advanced templates  
        
                            var mode = eventArgs.get_mode();  
        
                            if (mode == Telerik.Web.UI.SchedulerFormMode.AdvancedInsert ||  
        
                                mode == Telerik.Web.UI.SchedulerFormMode.AdvancedEdit) {  
        
                                // Initialize the client-side object for the advanced form  
        
                                var formElement = eventArgs.get_formElement();    
        
                                var templateKey = scheduler.get_id() + "_" + mode;                
        
                                var advancedTemplate = schedulerTemplates[templateKey];                           
        
                                if (!advancedTemplate)  
        
                                {  
        
                                    // Initialize the template for this RadScheduler instance  
        
                                    // and cache it in the schedulerTemplates dictionary  
        
                                    var schedulerElement = scheduler.get_element();  
        
                                    var isModal = scheduler.get_advancedFormSettings().modal;  
        
                                    advancedTemplate = new window.SchedulerAdvancedTemplate(schedulerElement, formElement, isModal);  
        
                                    advancedTemplate.initialize();  
        
                                    schedulerTemplates[templateKey] = advancedTemplate;  
        
                                }  
        
                                // Are we using Web Service data binding?  
        
                                if (!scheduler.get_webServiceSettings().get_isEmpty()) {  
        
                                    // Populate the form with the appointment data  
        
                                    var apt = eventArgs.get_appointment();  
        
                                    var isInsert = mode == Telerik.Web.UI.SchedulerFormMode.AdvancedInsert;  
        
                                    var editSeries = eventArgs.get_editingRecurringSeries();  
        
                                    advancedTemplate.populate(apt, isInsert, editSeries);  
        
                                }  
        
                            }  
        
                        }

We will update the online resources shortly with the above code.

Let us know if you have any problems with this.

Best wishes,
Peter
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

answered on 23 Sep 2009, 09:35 AM

Hi,

Tried the code sample you supplited and it doesn't work, however if I put this back in:

    
             function schedulerFormCreated(scheduler, eventArgs) {  
        
                   var $ = $telerik.$;  
        
                   var schedulerschedulerElement = scheduler.get_element();  
        
                   var formElement = $("div.rsAdvancedEdit", schedulerElement);  
        
                   var isModal = scheduler.get_advancedFormSettings().modal;  
        
                   if (formElement.length == 1) {  
        
                       // Initialize the client-side object for the advanced form  
        
                       var advancedTemplate = new window.SchedulerAdvancedTemplate(schedulerElement, formElement[0], isModal);  
        
                       advancedTemplate.initialize();  
        
                   }  
        
               }

It works fine?

answered on 25 Sep 2009, 08:40 PM

I decided I wanted to fully customize the Advanced Form for the Scheduler by creating my own. I've pretty much got it all working except for resetting the controls that allow the user to create the schedule. In the original example these values are all set in the AdvancedForm.js file. On my form I don't even have a RadSchedule component so I can't use this. I basically get the appointment id and retrieve the data from the database. Then I populate an Appointment item, with its resources, with all the data. However, resetting the state of the Range, Occurance, etc controls on the server side, by parsing out the RecurrenceRule string, looks like it's going to be fun. The AdvancedForm.ascx I used from the example takes the values from the controls and sets the appropriate value into the database. You by chance wouldn't have an example of going the other way - resetting the controls from the string value do you?

I've tried modifying the javascript to do this, but I'm not getting anywhere. Just not as experienced with javascript. Anyway, thought I'd ask before I get too far into this.

answered on 30 Sep 2009, 06:53 PM

This is a followup to my previous post under pucsoftware account from my work. I've been working on converting the scheduling aspect of the Scheduler Advanced Edit feature to a standard user control. I'm almost done and I thought should share some of the issues I've found, mainly with the AdvancedEdit.ascx control provided in your example.

1. The RecurrenceRuleText property returns non-printable characters in the string, specifically char10 and char13. Not sure if this is by design but I didn't see why they were needed.

2. The Interval property on the user control does not correctly handle the RecurrenceFrequency.Monthly case part of the switch statement. There is also no case statement for the RecurrenceFrequency.Yearly interval. This causes undesired results when scheduling appointments.

3. The Month property returns a blank string when using the Yearly frequency. This is because the combo boxes are being loaded without a value property and only a text property for list items. So, when the code references YearlyRepeatMonthForDate.SelectedValue you get a blank string. Changing this to YearlyRepeatMonthForDate.Text will allow it to work properly, though.

I'll continue working through this and update you if I find any other issues.

Darren

answered on 05 Oct 2009, 11:20 AM

Hi Darren,

Thank you for your feedback.

Can you confirm that you are using the latest advanced form user controls distributed with version 2009.2.826? There is no AdvancedEdit.ascx control there. All the advanced form functionality, except that related to recurring appointments, has been merged in AdvancedForm.ascx.

1. The format of the recurrence string requires new lines represented with "\r\n". For example:

    
            //* * *    
        
            string recurrenceString = "DTSTART:20090817T090000Z\r\nDTEND:20090817T100000Z\r\nRRULE:FREQ=DAILY;COUNT=5;INTERVAL=1;BYDAY=MO,TU,WE,TH,FR,SA,SU";      
        
            //* * *

As for the other two issues, I could not replicate the problems in my local tests. Please, provide specific steps necessary to observe the problems.

Regards,
Peter
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

answered on 05 Oct 2009, 06:28 PM

Thanks for the reply. Yes, I am using version 2009.2.826. I was going off memory so I got the name of the user control incorrect. Good to know that the line breaks are required in the format of the recurrance string. I can't seem to find any documentation on this. The code I mentioned in the other issues is being fixed properly by the client javascript. So, if you're using the RadScheduler control with the template it appears to work. But on the server side the Interval property is missing the Yearly logic:

  protected int Interval
  {
   get
   {
    switch (Frequency)   {
     case RecurrenceFrequency.Hourly:
          return int.Parse(HourlyRepeatInterval.Text);

     case RecurrenceFrequency.Daily:
          if (RepeatEveryNthDay.Checked)  {
           return int.Parse(DailyRepeatInterval.Text);
          }
          break;

case RecurrenceFrequency.Weekly:
return int.Parse(WeeklyRepeatInterval.Text);

     case RecurrenceFrequency.Monthly:
          if (RepeatEveryNthMonthOnDate.Checked)  {
              return int.Parse(MonthlyRepeatIntervalForDate.Text);
          }

return int.Parse(MonthlyRepeatIntervalForGivenDay.Text);
}

    return 0;
   }
  }

There should also be a case statement for RecurenceFrequency.Yearly value. There is nothing in the Interval property that ever references "YearlyRepeatDate" numeric text box which is needed to set the day of the year.

The Monthly issue I fixed. One of the arrays wasn't be populated (my fault) and now it is working.

Darren

answered on 25 May 2011, 09:50 AM

Hi,

i have a similiar problem as Karl. I'm using this tutorial:
http://demos.telerik.com/aspnet-ajax/scheduler/examples/advancedformtemplate/defaultvb.aspx

The form populates the data and the data of my scheduler is also updated when i press the save button. The problem is that my form is not closing due to some javascript errors.

The line: advancedTemplate = new window.SchedulerAdvancedTemplate(schedulerElement, formElement, isModal);
gives an Error -> Uncaught TypeError: undefined is not a function

function schedulerFormCreated(scheduler, eventArgs) {

// Create a client-side object only for the advanced templates

var mode = eventArgs.get_mode();

if (mode == Telerik.Web.UI.SchedulerFormMode.AdvancedInsert ||

mode == Telerik.Web.UI.SchedulerFormMode.AdvancedEdit) {

// Initialize the client-side object for the advanced form

var formElement = eventArgs.get_formElement();

var templateKey = scheduler.get_id() + "_" + mode;

var advancedTemplate = schedulerTemplates[templateKey];

if (!advancedTemplate) {

// Initialize the template for this RadScheduler instance

// and cache it in the schedulerTemplates dictionary

var schedulerElement = scheduler.get_element();

var isModal = scheduler.get_advancedFormSettings().modal;

advancedTemplate = new window.SchedulerAdvancedTemplate(schedulerElement, formElement, isModal);

advancedTemplate.initialize();

schedulerTemplates[templateKey] = advancedTemplate;

// Remove the template object from the dictionary on dispose.

scheduler.add_disposing(function() {

schedulerTemplates[templateKey] = null;

});

}

// Are we using Web Service data binding?

if (!scheduler.get_webServiceSettings().get_isEmpty()) {

// Populate the form with the appointment data

var apt = eventArgs.get_appointment();

var isInsert = mode == Telerik.Web.UI.SchedulerFormMode.AdvancedInsert;

advancedTemplate.populate(apt, isInsert);

}