Posting an Ajax request when menu item clicked

5 posts, 1 answers
  1. James
    James avatar
    29 posts
    Member since:
    Sep 2008

    Posted 20 Jul 2009 Link to this post

    Hi all,
    I want to call a server-side routine when a menu item is clicked, and have tried using the following code (extract):

     
    <telerik:RadScriptBlock ID="cb1" runat="server">  
        function InitiateAjaxRequest(arguments)  
        {  
          var ajaxManager = $find("<%= RadAjaxManager1.ClientID %>");  
          ajaxManager.ajaxRequest(arguments);  
        }  
     
     
      function emailMenuClicked(sender, args)  
      {  
         var itemValue = args.get_item().get_value();  
         if (args.get_item().get_text() == "Email Customer")  
         {  
            InitiateAjaxRequest("EmailCustomer",1);  
         }  
         if (args.get_item().get_text() == "Email Officer")  
         {  
            InitiateAjaxRequest("EmailOfficer",2);  
         }  
      }         
    </telerik:RadScriptBlock> 
     
     
     
        <telerik:RadContextMenu ID="RadContextMenu1" runat="server" EnableEmbeddedSkins="False" 
            Skin="Glastir" OnClientItemClicked="emailMenuClicked">  
            <Items> 
                <telerik:RadMenuItem runat="server" Text="Email Customer">  
                </telerik:RadMenuItem> 
                <telerik:RadMenuItem runat="server" Text="Email Officer">  
                </telerik:RadMenuItem> 
            </Items> 
            <Targets> 
                <telerik:ContextMenuControlTarget ControlID="RadScheduler1" /> 
            </Targets> 
        </telerik:RadContextMenu> 

     

    I need to put the Javascript in a RadScriptBlock because I need to evaluate the AjaxManager's client ID. However, when I do this, I get an 'object expected' error because the emailMenuClicked function is not visible to the RadContextMenu.

    When I put the emailMenuClicked function in an ordinary <script></script> tag, then the code there can't see the InitiateAjaxRequest function.

    I'm sure there's a simple solution, but I'm going round in circles on this - can someone point me in the right direction, please?

    Thanks,

    James

  2. Answer
    ManniAT
    ManniAT avatar
    877 posts
    Member since:
    Nov 2003

    Posted 20 Jul 2009 Link to this post

    Hi James,

    I guess you simply forgot the "script" tags.
    I used your menu and changed the codeblock (for test purposes) to this
    <telerik:RadScriptBlock ID="rcbJu" runat="server">  
     
        <script type="text/javascript">  
        function InitiateAjaxRequest(arguments)     
        {     
        alert("here we are");  
        }     
        
        
      function emailMenuClicked(sender, args)     
      {     
         var itemValue = args.get_item().get_value();     
         if (args.get_item().get_text() == "Email Customer")     
         {     
            InitiateAjaxRequest("EmailCustomer",1);     
         }     
         if (args.get_item().get_text() == "Email Officer")     
         {     
            InitiateAjaxRequest("EmailOfficer",2);     
         }     
      }            
      </script> 
    alert instead of a call - and added the "<script" things.
    Selecting a menuitem alerts as expected.

    Regards

    Manfred
    PS: sorry I forgot to post the closing tag of the RadScriptBlock :)
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. James
    James avatar
    29 posts
    Member since:
    Sep 2008

    Posted 20 Jul 2009 Link to this post

    Hi Manfred,
    Thanks - that's great. I hadn't spotted the <script></script> tags which are needed in the RadScriptBlock.

    One more question - slightly off topic in the Menu forum.

    Is it possible to get a return value back from the server-side AjaxRequest? As the event handler is void, I presume it has to be done via a hidden control or similar?

    James
  5. ManniAT
    ManniAT avatar
    877 posts
    Member since:
    Nov 2003

    Posted 20 Jul 2009 Link to this post

    Hi James,

    you are right - using a hidden field is the "normal" way for this.
    Don't forget to add this field to the "updatedControls" on your ajax manager.

    The Ajax manager has a client event - OnResponseEnd - there you can trigger the results.

    Last not least (to be totally OT) - if you only need to exchange simple values (no need for controls on the server) an async ajax webservice call is much "smaller". You can pass a string - and !!! return a string.
    Of course not like a direct return value assignement - xx=CallTheService(strParam) does not work.
    Instead you pass a "SuccessFunction" which gets called on return.
    Here I posted a sample about this approach:
    http://www.telerik.com/community/forums/aspnet-ajax/input/how-to-achive-validation-while-typing.aspx

    Regards

    Manfred
    PS: if one of my posts answered your qestion - please "mark as answer"
  6. James
    James avatar
    29 posts
    Member since:
    Sep 2008

    Posted 21 Jul 2009 Link to this post

    Hi Manfred,
    Thanks - that's really useful.

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