Insert appointment client side

23 posts, 0 answers
  1. Jonathan Levy
    Jonathan Levy avatar
    56 posts
    Member since:
    Sep 2008

    Posted 22 Apr 2009 Link to this post

    Hi

    Are there any examples of how to add an appointment to the diary on the client side. I can add an appointment to by database using AJAX but I have to refresh the page to show the new appointment. I'd like to be able to just add it to the scheduler without refreshing the page.

    Thanks
    Jon
  2. Peter
    Admin
    Peter avatar
    6637 posts

    Posted 22 Apr 2009 Link to this post

    Hello Jonathan,

    Using AJAX and calling RadScheduler's Rebind() method when you updated the database should refresh the control and display the changes.

    Alternatively, you can use the new client binding feature of RadScheduler demonstrated in the following examples:

    http://demos.telerik.com/aspnet-ajax/scheduler/examples/webservice/defaultcs.aspx

    http://demos.telerik.com/aspnet-ajax/scheduler/examples/wcf/defaultcs.aspx


    All the best,
    Peter
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Jonathan Levy
    Jonathan Levy avatar
    56 posts
    Member since:
    Sep 2008

    Posted 22 Apr 2009 Link to this post

    Hi Peter

    I use jquery to insert the appointment into my database. The example is more than I was looking for. Is there no way of adding an appointment in javascript?

    something like scheduler.add_appointment(appointment); ?

    Cheers
    Jon
  5. Peter
    Admin
    Peter avatar
    6637 posts

    Posted 24 Apr 2009 Link to this post

    Hi Jonathan,

    Yes, RadScheduler's client object has an insertAppointment():
    http://www.telerik.com/help/aspnet-ajax/client-side-objects-radscheduler.html

    Here is an illustration of its usage:
     function onClientTimeSlotClick(sender, eventArgs) {  
            var newAppointment = new Telerik.Web.UI.SchedulerAppointment();  
     
            var startTime = eventArgs.get_targetSlot().get_startTime();  
     
            var endTime = new Date(startTime);  
            endTime.setMinutes(endTime.getMinutes() + 45);  
     
            newAppointment.set_start(startTime);  
            newAppointment.set_end(endTime);  
            newAppointment.set_subject("Manually Inserted Appointment");  
     
            sender.insertAppointment(newAppointment);  
        }  


    Greetings,
    Peter
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  6. Jonathan Levy
    Jonathan Levy avatar
    56 posts
    Member since:
    Sep 2008

    Posted 30 Apr 2009 Link to this post

    Hi Peter

    I have this but it doesn't quite work. I'm in my own function so don't have access to the sender so I've tried getting the scheduler using $find(). Can you see anything that would stop it working?

    var

     

    newAppointment = new Telerik.Web.UI.SchedulerAppointment();

     

    newAppointment.set_start(start);

    newAppointment.set_end(end);

    newAppointment.set_subject($.clientID(

    "TextBoxSubject").val());

     

     

    var scheduler = $find('<%= RadScheduler1.ClientID %>');

     

    scheduler.insertAppointment(newAppointment);

  7. Peter
    Admin
    Peter avatar
    6637 posts

    Posted 01 May 2009 Link to this post

    Hi Jonathan Levy,

    That looks fine to me. Have you tried this code? Does it work?


    Regards,
    Peter
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  8. Gerhard
    Gerhard avatar
    2 posts
    Member since:
    Apr 2009

    Posted 09 May 2009 Link to this post

    I have a similar problem, where I want to insert an appointment on the clientside only.

    The reason why I'm trying to do this is because our schedular is quite large in size with a lot of hacks and twirks, and the page itself contains a lot of different components and is quite heavy. We've tried using ajax, but every event takes a couple of seconds, which is just too slow for us to use.

    I tried using the web service functions that are built in the schedule component, but it was simply too limited in functions for us to use. Instead, we came up with the idea to call our own web services through javascript. What we do is catch some of the events in javascript, call a web service, and abort the postback. This works fine when moving around or resizing appointments.

    However, when deleting or inserting appointments it's not as simple. Using "sender.insertAppointment(newAppointment);" tries to make a postback, and we're trying to avoid that. We want to insert or delete on the client only - nothing else.

    How do you do it on your own examples using web services, since you're able to insert or delete without postbacks?
  9. T. Tsonev
    Admin
    T. Tsonev avatar
    2772 posts

    Posted 12 May 2009 Link to this post

    Hello Gerhard,

    It looks like using the client rendering independently of our predefined web services is a popular request. We like the idea and we plan to implement it in such way that the web services can be turned off completely or mixed with other data sources.

    We hope to be able to complete this in time for the Q2 release, but we have other tasks planned and it might get delayed.

    For the moment you might try the following workaround. You can cancel the events that are fired before making the actual web service calls - OnClientAppointmentWebServiceInserting, OnClientAppointmentsPopulating and the like. This way the appointment will be rendered, but no web service call will take place. For this to work the scheduler must be in web service mode, even if the service is not actually used. For example:

    <telerik:RadScheduler             OnClientAppointmentWebServiceInserting="cancelEvent"
    OnClientAppointmentsPopulating="cancelEvent"
    OnClientResourcesPopulating="cancelEvent" ...>
    <WebServiceSettings Path="~/SchedulerDataService.asmx" />
    </telerik:RadScheduler>

    function buttonClick(e)
    {
        var start = new Date("2009/05/10 15:00");
        var end = new Date("2009/05/10 16:00");

        var newAppointment = new Telerik.Web.UI.SchedulerAppointment();
        newAppointment.set_start(start);
        newAppointment.set_end(end);
        newAppointment.set_subject("Test");

        var scheduler = $find('<%= RadScheduler1.ClientID %>');
        scheduler.insertAppointment(newAppointment);
    }

    function cancelEvent(sender, eventArgs)
    {
        eventArgs.set_cancel(true);
    }


    I hope this helps.

    Greetings,
    Tsvetomir Tsonev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  10. Marbry
    Marbry avatar
    123 posts
    Member since:
    Aug 2012

    Posted 30 Jan 2013 Link to this post

    Has this been updated?  I'm trying to do the same thing, insert and update appointments on the client only and handle the changes with my own web service calls.

    I haven't had any luck in preventing the post back though, I keep getting an UpdateAppointment  arg in a postback when I call updateAppointment() on the client ":__EVENTARGUMENT=%7b%22command%22%3a%22UpdateAppointment%22%2c%22appointmentID"
  11. Plamen
    Admin
    Plamen avatar
    2734 posts

    Posted 04 Feb 2013 Link to this post

    Hi Marbry,

     
    You can insert and update appointment in scenario with Web Service binding as it is done explained in this help article against the insertAppointment and updateAppointment functions.

    I am attaching a sample project where the insert is done with a button click. Hope this will be helpful.

    Kind regards,
    Plamen
    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.
  12. Marbry
    Marbry avatar
    123 posts
    Member since:
    Aug 2012

    Posted 04 Feb 2013 Link to this post

    I would prefer not to have to rewrite everything I've done so far just to implement all that.

    Are you saying there is still no way to add an appointment on the client and have it rendered without a postback or implementing that entire approach?

    For instance, in the RadTreeView and other controls on the client we can call trackChanges()  ... make the desired changes via client api ... then call commitChanges() and cancel the postback as desired.  But the changes we made are still rendered on the client, and we can handle any server side updates separately as needed.  That's basically what I'm trying to achieve.

    I can intercept the postback and stop that, but the changes I make via the client API are never rendered.
  13. Plamen
    Admin
    Plamen avatar
    2734 posts

    Posted 06 Feb 2013 Link to this post

    Hi Marbry,

     
    Thank you for your concern with RadControls.

    Unfortunately such functionality is not supported with RadScheduler. Yet you can add and update appointments with callback instead of postback as it is done in the attached project. Please excuse us for this limitation of the control.

    Greetings,
    Plamen
    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.
  14. Marbry
    Marbry avatar
    123 posts
    Member since:
    Aug 2012

    Posted 17 Jun 2013 Link to this post

    I don't like having to hack the emitted HTML since it could break it, but I did get this working for now for editing an existing appointment.  But here it is in case someone else might find it useful.  It does prevent having to necessarily reload the entire page.

    This is the callback function for my custom editing dialog, using radwindow.  It sets the edited values as arguments to pass them back to the parent page that contains the scheduler.

    function OnEditDialogClose(sender, args)
    {
        var startDate = args._argument["StartDate"];
        var endDate = args._argument["EndDate"];
        var value = args._argument["Value"];
        var apptID = args._argument["apptID"];
     
        var sched = $find( "<%= scheduler.ClientID %>" );
     
        var appt = sched._appointments.findByID(apptID);
        if (appt != null)
        {
            appt.set_start(new Date(startDate));
            appt.set_end(new Date(endDate));
     
            appt._domElement.title = value;
     
            var arr = appt._domElement.children[0].children[0].children[0].children[0].innerHTML.split("<a");
            if (arr.length == 2)
            {
                var newHTML = arr[0].replace(appt.get_subject(), value) + "<a" + arr[1];
                appt._domElement.children[0].children[0].children[0].children[0].innerHTML = newHTML;
            }
     
            appt.set_subject(value);
        }
    }
  15. Plamen
    Admin
    Plamen avatar
    2734 posts

    Posted 20 Jun 2013 Link to this post

    Hi Marbry,

     
    Thank you for sharing your solution with the community.

    Regards,
    Plamen
    Telerik
    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 the blog feed now.
  16. Rob
    Rob avatar
    43 posts
    Member since:
    Aug 2010

    Posted 28 Nov 2013 Link to this post

    Is it possible to get the database schema for the example you attached as SQL insert statements? The provided MDF is the wrong version for attaching to my SQL server.
  17. Plamen
    Admin
    Plamen avatar
    2734 posts

    Posted 03 Dec 2013 Link to this post

    Hello,

    Here is the script that should help you generate the same table.

    Hope this will be helpful.

    Regards,
    Plamen
    Telerik
    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 the blog feed now.
  18. Peter From LA
    Peter From LA avatar
    35 posts
    Member since:
    May 2005

    Posted 27 Oct 2015 in reply to Plamen Link to this post

    Fast-forward to today...

    Is there a way to achieve adding/editing/deleting appointments on Client-Side without the dreaded post-backs or service calls?

    In some cases all we want is the pretty picture - we may have our own custom ways to get there...

     

    P

  19. Plamen
    Admin
    Plamen avatar
    2734 posts

    Posted 28 Oct 2015 Link to this post

    Hi,

    Adding, editing or deleting appointments on Client-Side without the dreaded post-backs or service calls is not supported by RadScheduler.

    Hope this will explain the issue.

    Regards,
    Plamen
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  20. Peter From LA
    Peter From LA avatar
    35 posts
    Member since:
    May 2005

    Posted 28 Oct 2015 in reply to Plamen Link to this post

    Is there a "real" reason behind the inability to simply add/edit/delete appointments on the Client-Side, or you just have not gotten to it yet?

    I would totally understand if this is of really low priority for Telerik, but what is hard for me to accept is that there is no need for it...

  21. Plamen
    Admin
    Plamen avatar
    2734 posts

    Posted 02 Nov 2015 Link to this post

    Hi,

    Thank you for sharing your opinion regarding this functionality.

     Implementing such functionality is not needed by any of the currently supported  bindings by RadScheduler but rather a custom way of inserting, updating and deleting the appointments. That is why such case is not much desired by many customers. Yet you can log such feature is our Feedback portal and explain what is the exact case you would use it so it can be consider its possible implementation for the future versions of the control.

    Regards,
    Plamen
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  22. Sean
    Sean avatar
    2 posts
    Member since:
    Aug 2016

    Posted 2 days and 10 hours ago Link to this post

    Hi,

    I am inserting an appointment on client side that is within a for loop.  Does not matter how many appointments I insert, only the last appointment shows in the radscheduler.  Thanks for your help in advance.

     

    var newAppointment = new Telerik.Web.UI.SchedulerAppointment();
    var startDate = new Date(arrStartYear[0], arrStartDate[0] - 1, arrStartDate[1], arrStartTime[0], arrStartTime[1]);
    var endDate = new Date(arrEndYear[0], arrEndDate[0] - 1, arrEndDate[1], arrEndTime[0], arrEndTime[1]);
    var subject = results[i].AppointmentNames;
    newAppointment.set_start(startDate);
    newAppointment.set_end(endDate);
    newAppointment.set_subject(subject);
    radAppointmentScheduler.insertAppointment(newAppointment);

  23. Plamen
    Admin
    Plamen avatar
    2734 posts

    Posted 1 day and 18 hours ago Link to this post

    Hi,

    This is expected behavior since the insertAppointment method invokes a postback or callback and only one of the appointments is added with it. Unfortunately there is no method for inserting many appointments at the same time. In such case you can either create your own method to add appointments directly to the datasource and rebind the scheduler after that.

    Regards,
    Plamen
    Telerik by Progress
    Telerik UI for ASP.NET AJAX is ready for Visual Studio 2017 RC! Learn more.
  24. Sean
    Sean avatar
    2 posts
    Member since:
    Aug 2016

    Posted 9 hours ago Link to this post

    Thanks Plamen,

    Another question:  I am currently using a web service (asmx) that brings back a List<> object filled with appointments from sql server.  Is it possible in javascript to just bind the List<> to the radscheduler? or do I have to follow your demo and create another provider and controller?  It seems like double the work. I have bound a data table directly on server side before and just wondering if the same logic exists on client side?

    Thanks

Back to Top
UI for ASP.NET Ajax is Ready for VS 2017