Can anyone suggest a quick and easy way to hide the advanced form and modal overlay using jquery?

8 posts, 1 answers
  1. Roatin Marth
    Roatin Marth avatar
    65 posts
    Member since:
    Nov 2007

    Posted 09 Sep 2011 Link to this post

    I need a quick programmatic way to click the cancel button of the advanced form to force to close/hide for the user at a specific time.

  2. Ivana
    Admin
    Ivana avatar
    657 posts

    Posted 13 Sep 2011 Link to this post

    Hello Roatin,

    I am not sure I understand what exactly is the desired scenario.

    If you want to force a post-back and you want to see the calendar in its initial state, then you can make a server-side method (as a handler or a server-side event for example) and call Rebind(); method of the RadScheduler.
    Ex:
    RadScheduler1.Rebind();

    Hope this helps.

    Kind regards,
    Ivana
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Roatin Marth
    Roatin Marth avatar
    65 posts
    Member since:
    Nov 2007

    Posted 16 Sep 2011 Link to this post

    I just want to hide the advanced form in javascript on a scheduler callback method.

    i.e something like this
    $('#myAdvacnedFormId').hide(); //but i'd need to remove the modal overlay div as well

    or
    //find the cancel button of the advanced form and force a click
    $('#myAdvancedFormCancelButtonId').click();  //force/trigger a click of the cancel button of the advanced form to close it
  5. Answer
    Ivana
    Admin
    Ivana avatar
    657 posts

    Posted 20 Sep 2011 Link to this post

    Hi Roatin Marth,

    You could use the RadScheduler's method hideAdvancedForm().
    I have made an example for you that hides the AdvancedForm client-side when the 'Esc' key is pressed.
    function pageLoad() {
                var $ = $telerik.$;
                $(document).keydown(function (event) {
                    if (event.keyCode == '27') {
                        var scheduler = $find('<%=RadScheduler1.ClientID %>');
                        scheduler.hideAdvancedForm();
                    }
                });
     
            }

    You should keep in mind that the hideAdvancedForm() method only works when the modal form of the RadScheduler is set to true. Ex: <AdvancedForm Modal="true" />.

    Hope this helps.

    Kind regards,
    Ivana
    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
  6. Prava kafle
    Prava kafle avatar
    212 posts
    Member since:
    Apr 2010

    Posted 27 Sep 2011 Link to this post

    Hi Ivana,

    I have customized the background color of selected timeslots as per project requirement . When I used 'scheduler.hideAdvancedForm();'  to hide  advanced form  it   changed the timeslots's background color  giving it a uniform color. How can I avoid this effect?

    Thanks,
    Prava
  7. Ivana
    Admin
    Ivana avatar
    657 posts

    Posted 30 Sep 2011 Link to this post

    Hello Prava,

    To style the time slots in the RadScheduler you could use the following code snippet:
    CSS
    .rsContent .rsContentTable td
    {
        background-color: Yellow;
    }

    If you want just a particular time slot colored, you can bind the RadScheduler to a web service.
    When the RadScheduler is bound to a web service,  no post-back to the server is made when the AdvancedForm is opened, and the CssClass that is set in TimeSlotCreated will perist.

    Hope that helps.

    Kind regards,
    Ivana
    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
  8. Prava kafle
    Prava kafle avatar
    212 posts
    Member since:
    Apr 2010

    Posted 30 Sep 2011 Link to this post

    Hi Ivana,

    I am setting the background color of the special time slots at server side  using "ONTIMESLOTCREATED" event. With my client side script on "save" button click event,  I have following code which cancels the post back and closes the advanced form, somehow time slots background color gets messed up. I want   time slots background color  to persist even after closing Advanced form at client side.

        function SaveAdvancedApptEditForm(
                     var scheduler = $find("<%=rsTicketsSchedule.ClientID%>");
                     var scheduler_SelectedView = scheduler.get_selectedView();
                       
                      var apptScheduler = new Appt_Scheduler();
                     apptScheduler.checkforConflictToUpdateAppointment(scheduler_SelectedView);

                     var scheduler = $find('<%=rsTicketsSchedule.ClientID %>');
                      scheduler.hideAdvancedForm();
                      return false;
                  }


    Thanks,
    Prava
  9. Ivana
    Admin
    Ivana avatar
    657 posts

    Posted 05 Oct 2011 Link to this post

    Hi Prava Kafle,

    I tied to reproduce the issue you are experiencing, and I am not sure whether I understand what exactly is your scenario.

    Could you please send us a support ticket with a sample web page illustrating the issue attached to it, so we can examine it  locally.

    Thanks.

    All the best,
    Ivana
    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
UI for ASP.NET Ajax is Ready for VS 2017