Note that there are some explanatory texts on larger screens.

plurals
  1. POASP.NET Forms: Using jquery to post to asp.net page method with parameters
    text
    copied!<p>I've seen lots of related questions, but nowhere have I found a simple example of code that passes parameters back to a page method via jquery.</p> <p>I've looked through some of the examples at encosia.com (thanks, Dave) but still haven't managed to get it working. Here's the code so far:</p> <p>Updated - added some code to pass in params, but it's still not working. </p> <p>test.aspx:</p> <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; &lt;head runat="server"&gt; &lt;title&gt;test page&lt;/title&gt; &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"&gt;&lt;/script&gt; &lt;script type="text/javascript"&gt; $(document).ready(function() { // Add the page method call as an onclick handler for the div. $("#Result").click(function() { var intxt = document.getElementById("&lt;%= txtIn.ClientID %&gt;").value; var params = $.toJSON({ 'inStr': intxt }); $.ajax({ type: "POST", url: "test.aspx/RunTest", data: params, contentType: "application/json; charset=utf-8", dataType: "json", success: function(msg) { $("#Result").text(msg); } }); }); }); &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;form id="form1" runat="server"&gt; &lt;div id="Result"&gt;Click here&lt;/div&gt; &lt;asp:TextBox ID="txtIn" runat="server"&gt;&lt;/asp:TextBox&gt; &lt;/form&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>and in test.aspx.vb:</p> <pre><code> &lt;WebMethod()&gt; _ Public Shared Function RunTest(ByVal instr As String) As String Return "this is your string: " + instr End Function </code></pre> <p>Update:</p> <p>The RunTest menthod above is never called. However, if I also have:</p> <pre><code> &lt;WebMethod()&gt; _ Public Shared Function RunTest() As String Return "no params here" End Function </code></pre> <p>Then the 2nd method IS called. </p> <p>What am I missing? Is this the wrong approach?</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload