RadScheduler AdvancedForm

5 posts, 2 answers
  1. Miguel
    Miguel avatar
    13 posts
    Member since:
    Nov 2011

    Posted 06 Dec 2011 Link to this post

    On my project, i'm using RadScheduler. 


    In result of the needs, i had to create a custom edit "window". 


    Basically in the main page i have:


    <telerik:RadScheduler runat="server" ID="radScheduler" SelectedView="TimelineView"
                    EnableExactTimeRendering="True" DayStartTime="00:00:00" DayEndTime="23:59:59"
                    DataKeyField="ID" DataSubjectField="Subject" DataStartField="Start" DataEndField="End"
                    DataRecurrenceField="RecurrenceRule" DataRecurrenceParentKeyField="RecurrenceParentId"
                    AllowInsert="false" AllowDelete="False" AllowEdit="false" ColumnWidth="100px"
                    OnAppointmentCreated="radScheduler_AppointmentCreated" AdvancedForm-Modal="true"
                    Width="100%" FirstDayOfWeek="Monday" ShowHoursColumn="False" Skin="Telerik" ShowsConfirmationWindowOnDelete="False"
                    OnFormCreated="radScheduler_FormCreated">
                    <TimelineView UserSelectable="true" GroupingDirection="Vertical" NumberOfSlots="24"
                        ColumnHeaderDateFormat="HH:mm" ShowInsertArea="false" StartTime="00:00:00" SlotDuration="01:00:00"
                        GroupBy="Room" />
                    <DayView UserSelectable="false" />
                    <MonthView UserSelectable="false" />
                    <WeekView UserSelectable="false" />
                    <AdvancedEditTemplate>
                        <scheduler:AdvancedForm runat="server" ID="AdvancedInsertForm1" Mode="Edit"/>
                    </AdvancedEditTemplate>
                </telerik:RadScheduler>



    and also a RadAjaxManager.


    <scheduler:AdvancedForm>
    points to AdvancedForm.ascx


    In AdvancedForm.ascx i have this javascript block 


       
    <script type="text/javascript">
     
     
            var chart; // global
         
            /*
             * Request data from the server, add it to the graph
             */
            function requestData() {
                $.ajaxSetup({ cache: false });
                $.getJSON('exampleurl', function (data) {
     
     
                    //Clear the "old" series
                    while (chart.series.length > 0) {
                        chart.series[0].remove(true);
                    }
     
     
                    //declare Json
                    var jsonObj = {
                        series: []
                    };
     
     
                    //Cycle through each JSONobjcect returned by the url
                    $.each(data, function (i, item) {
                        var key = item['tag'];
                        var value = item['data']['Velocity'];
     
     
                        jsonObj.series.push({
                            "name": key,
                            "data": value
                        });
                    });
     
     
                    //Add each of the key:value pair to the series
                    for (var i in jsonObj.series) {
                        chart.addSeries(jsonObj.series[i]);
                    }
     
     
                    // call it again after ten seconds
                    setTimeout(requestData, 10000);
                });
            }
     
     
            $(document).ready(function () {
                chart = new Highcharts.Chart({
                    chart: {
                        renderTo: 'container',
                        defaultSeriesType: 'column',
                        events: {
                            load: requestData
                        }
                    },
                    title: {
                        text: 'Test Chart'
                    },
                    xAxis: {
                        title: {
                            text: 'Viaturas'
                        },
                        categories: ['']
                    },
                    yAxis: {
                        min: 0,
                        title: {
                            text: 'Velocidade (Km/h)'
                        }
                    },
                    tooltip: {
                        formatter: function () {
                            return '' +
                                this.series.name + ': ' + this.y + ' Km/h';
                        }
                    },
                });
            });
    </script>



    the problem i have is that the $(document).ready is never called...


    Thanks in advance for the help..
  2. Answer
    Peter
    Admin
    Peter avatar
    6637 posts

    Posted 07 Dec 2011 Link to this post

    Hello Miguel,

    Please, use the following code:

    $telerik.$(document).ready(function () { alert(1); });

    For more information on using jQuery with RadControls, please see this help topic -
    http://www.telerik.com/help/aspnet-ajax/introduction-using-jquery.html.



    Best wishes,
    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. Miguel
    Miguel avatar
    13 posts
    Member since:
    Nov 2011

    Posted 07 Dec 2011 Link to this post

    My solution was instead of having a UserControl, i paste all the code between <AdvancedEditTemplate> :)

    But i've tried your suggestion and it also works :)

    I now have another doubt, so i'll recycle this thread.

    It's possible to pass the appointment user as a parameter in the function that's fired onclientappointmentclick??
  4. Miguel
    Miguel avatar
    13 posts
    Member since:
    Nov 2011

    Posted 07 Dec 2011 Link to this post

    I've found the answer so i'll share it:

    function example(sender, eventArgs) {
     
                //Get the userID of the appointment that fired the event
                var apt = eventArgs.get_appointment().get_resources().getResource(0).get_text();
     
                alert(apt);


    Thanks anyway for all the help :)
  5. Answer
    Peter
    Admin
    Peter avatar
    6637 posts

    Posted 07 Dec 2011 Link to this post

    Hi Miguel,

    I assume you have defined a resource type with called "User". If that's the case, you can call get_resources() of the Appointment client object and use the API of the SchedulerResourceCollection to access the user information.

    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
Back to Top