How to Call a WebMethod for a control in javascript

Question

I'm trying to call a WebMethod (GetData()) for a control in a web page using javascript.

<script type="text/javascript">
    $(document).ready(function () {
        //this selector needs fixed
        $('<%= Control1.ClientID %>').GetData();
    });
</script>

<tel:RadScriptManager ID="RadScriptManager1" runat="server" />
<tel:RadAjaxPanel ID="RadAjaxPanel1" runat="server" LoadingPanelID="RadAjaxLoadingPanel1">
    <uc1:Control ID="Control1" runat="server" />
</tel:RadAjaxPanel>

The uc:Control code:

    [WebMethod()]
    [ScriptMethod()]
    protected void GetData()
    {
        //stuff happens here
    }

I can't figure out what kind of selector to use. I have multiple controls on the page, and i want to call them at different times. What kind of selector or what command do I use to run this WebMethod?

There is a somewhat similar [SO posting](http://stackoverflow.com/questions/886903/calling-asp-net-server-side-method-via-jquery). — Uwe Keim, Jan 27 '11 at 19:15

Matt · Accepted Answer · 2011-01-27T21:32:32.757

It is my understanding that it is not possible to call a webmethod/pagemethod on a child/user control.

If you were to move this web method to the parent aspx, you would need to do something like this:

jQuery.ajax({
  type: 'POST',
  contentType: 'application/json; charset=utf-8',
  data: '{}',
  dataType: 'json',
  url: 'MyPage.aspx/SomePageMethod',
  success: function(result){
    alert(result);
  }
});

stephen776 · Answer 2 · 2011-01-27T19:21:13.803

0

This will select the element with an ID that ends with the ControlID you pass to it, thus ignorning any extra text that asp.net prepends to your control ID's

$("[id$='_ControlIDHere']")

EDIT: I may have misunderstood the question but if you are in fact just looking for a selector to get a reference to your controls then my method will work

edited Jan 27 '11 at 19:21

answered Jan 27 '11 at 19:12

stephen776

9,134
15
74
123

score 0 · Answer 3 · answered Jan 27 '11 at 19:21

You are mixing up JavaScript and ASP.NET over here. Even though you see the <uc1:Control> tag in your .aspx file, this is not what actually gets outputted to the browser. The control must output some valid HTML code which is what JavaScript actually sees.

You should look at the resulting HTML code (i.e. right click -> View Source) and find to which HTML element your control is mapping to, and based on your findings construct a new selector.

How to Call a WebMethod for a control in javascript

3 Answers3