Bind elements in AdvancedInsert and AdvancedEdit template using wcf services

6 posts, 0 answers
  1. Mahesh
    Mahesh avatar
    12 posts
    Member since:
    Jul 2012

    Posted 23 Aug 2012 Link to this post


    Hi,

      We are using Telerik RadScheduler to bind the events. We are using wcf service method to bind the data.
    The data binding is done successfully and its showing the data correctly. 

    Now we are using AdvancedInsertTemplate and AdvancedEditTemplate respectively to insert and edit the events. So in the template we have added two use controls and it contains form elements for insertion and deletion.

    When clicking on an empty day,a popup is showing with insert form. Also when clicking on an event , the edit form is also coming.

    Now i have got some questions:

    1. Up on editing how to bind the existing details in the edit form , we are using a user control as edit form. Also we want to do it using a wcf service methods, since we are doing the initial binding with wcf services. Now its showing an empty form.
    2. Similarly on insert also we want to do it from client side using wcf services.
    3. Also i want to know whether we can use methods from a wcf service hosted in some other machine. Now while checking we are using wcf services inside our website. But we want to know whether we can use methods from a wcf service hosted outside our website.


    Thanks,
    Mahesh
  2. Peter
    Admin
    Peter avatar
    6637 posts

    Posted 23 Aug 2012 Link to this post

    Hello Mahesh,

    Please, follow this tutoral:

    Using the Advanced Templates ->section on How to use the advanced user controls in Client Side binding mode (Web Services)

    Greetings,
    Peter
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  3. Mahesh
    Mahesh avatar
    12 posts
    Member since:
    Jul 2012

    Posted 23 Aug 2012 Link to this post

    Hi Peter,

    Thanks for the reply ...

     I have  checked the AdvanceForm.js in the live demo project files. I copied that into my project and tried to run the application .
    Then i got some script error like "this._pickers.startDate is null".

    Do we need to modify this file for each template.? Can you please advice me on ow to proceed from here?

    Is it a difficult thin to bind templates with wcf services? Is it better to use code behind method?

    Given below is my sample code i have tried

    <telerik:RadScheduler runat="server" ID="RadScheduler1" SelectedView="MonthView"
                AllowDelete="false" AppointmentStyleMode="Auto" OnClientAppointmentWebServiceInserting="AppointmentInsert"
                AllowEdit="true" AllowInsert="true" OnClientAppointmentContextMenuItemClicking="ItemClicked"
                OnClientTimeSlotContextMenuItemClicking="NewItemClick" OnClientDataBound="onSchedulerDataBound"   CustomAttributeNames="CustomAttribute,UserName"
                OnClientFormCreated="schedulerFormCreated" >
                <AdvancedForm Modal="true" />
                <WebServiceSettings Path="CalendarService.svc" ResourcePopulationMode="ServerSide" />
                            
                <AdvancedEditTemplate>
                    <div class="rsAdvancedEdit rsAdvancedModal">
                        <div class="rsModalBgTopLeft">
                        </div>
                        <div class="rsModalBgTopRight">
                        </div>
                        <div class="rsModalBgBottomLeft">
                        </div>
                        <div class="rsModalBgBottomRight">
                        </div>
                        <div class="rsAdvTitle">
                            <h1 class="rsAdvInnerTitle">
                                <%# Container.Appointment.Owner.Localization.AdvancedEditAppointment %></h1>
                            <asp:LinkButton runat="server" ID="LinkButton1" CssClass="rsAdvEditClose" CommandName="Cancel"
                                CausesValidation="false" ToolTip='<%# Container.Appointment.Owner.Localization.AdvancedClose %>'>
                                <%# Container.Appointment.Owner.Localization.AdvancedClose%>
                            </asp:LinkButton>
                        </div>
                        <div class="rsAdvContentWrapper">
                            <telerik:RadTextBox ID="SubjectTextBox" runat="server" Text='<%#Bind("Subject")%>'
                                Label='<%# Container.Appointment.Owner.Localization.AdvancedSubject%>'>
                            </telerik:RadTextBox>
                            Custom content...
                        </div>
                    </div>
                </AdvancedEditTemplate>
                 
                <AppointmentContextMenus>
                    <telerik:RadSchedulerContextMenu runat="server" ID="SchedulerAppointmentContextMenu">
                        <Items>
                            <telerik:RadMenuItem Text="Edit Event" Value="CommandEdit">
                            </telerik:RadMenuItem>
                        </Items>
                    </telerik:RadSchedulerContextMenu>
                </AppointmentContextMenus>
                <TimeSlotContextMenus>
                    <telerik:RadSchedulerContextMenu runat="server" ID="SchedulerTimeSlotContextMenu">
                        <Items>
                            <telerik:RadMenuItem Text="New Event" Value="New" />
                        </Items>
                    </telerik:RadSchedulerContextMenu>
                </TimeSlotContextMenus>
            </telerik:RadSchedule>

    Javascript
       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 have used the AdvsncedForm.js file from the live demos "RadControls for ASP.NET AJAX Q2 2012".
  4. Peter
    Admin
    Peter avatar
    6637 posts

    Posted 24 Aug 2012 Link to this post

    Hi Mahesh,

    You have copied the code from AdvancedForm.ascx directly in the AdvancedEditTemplate tags. This is expected to cause problems because the AdvancedForm user control has code behind logic as well which is missing from your implementation. Please, follow closely the customzing the advanced form demo - http://demos.telerik.com/aspnet-ajax/scheduler/examples/advancedformtemplate/defaultcs.aspx.



    All the best, Peter
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  5. Mahesh
    Mahesh avatar
    12 posts
    Member since:
    Jul 2012

    Posted 26 Aug 2012 Link to this post

    Hi Peter,

     I didn't copied the whole code. What i done is we copied the AdvancedForm.js file as a whole. Now i understood that the issue is my edit template doesn't contain some controls like startdate, enddate etc.

    So my question is , if i want to show only the Subject text in the edit form,what i need to do in the edit template and how i need to modify the AdvancedForm.js.

    Actually in the above template given we have used only the Subject text, so i am checking whether is there any method to do this?


    Thanks,
    Mahesh
  6. Cat Cheshire
    Cat Cheshire avatar
    128 posts
    Member since:
    Jun 2010

    Posted 29 Aug 2012 Link to this post

Back to Top