How to submit asp.net form data using jquery ajax feature

Question

dear all i want to know how to submit asp.net form data using jquery ajax functionality and how im get that json data in the server side

?

Dear you ... this is not a Generate-Code Forum, shows us what have you tried, what have you tested and then we will help you with some code if you're stuck... — balexandre
– balexandre, Commented Sep 30, 2011 at 8:55

Amin Sayed · Accepted Answer · 2011-09-30 13:08:07Z

2

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$("#<%=btnSubmit.ClientID %>").click(
  function()
  {
    $.ajax
    ({
         type: "POST",
         contentType: "application/json; charset=utf-8",
         url: "Default.aspx/AcceptFormData",
         data: "{'funcParam':'"+$('#formName').serialize()+"'}",
         dataType: "json",
         success: function(msg)
         {
              var msgFromASPXFunction = msg.d
         }
     });
  }
 );
});


[System.Web.Services.WebMethod]
public static string AcceptFormData(string funcParam)
{
  // this is your server side function
  //the data you will get will be in format e.g. a=1&b=2&c=3&d=4&e=5 inside funcParam variable
  return "Data Submitted";

}

Just note the server-side function name should match the parameter you specified in the url property of $.ajax function of jQuery. (In above case it is "AcceptFormData"

Also the parameter name should be same as of the server side function parameter. In this case it is "funcParam".

Just compare the $.ajax and server-side function in this code.

Regards,

Amin Sayed

(Note: Please mark if it is helpful)

answered Sep 30, 2011 at 13:08

Amin Sayed

1,2702 gold badges13 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Amila Thennakoon Over a year ago

Thank you a lot For your Post could you please Explain me Below Code Fraction data: "{'funcParam':'"+$('#formName').serialize()+"'}",

Amin Sayed Over a year ago

This is a parameter to your C# function passed from the javascript, whenever you try to call the Ajax (in this case at the time you submit). You can see 'funcParam' name matches the parameter of your C# function AcceptFormData. You need to make sure these two match.

sikender · Accepted Answer · 2011-09-30 08:57:49Z

1

<form action="#" id="example-form">

...

</form>

<script type="text/javascript">

    $('#example-form').submit(function(){

        // block form

        $.post('putUrlHere', $('#example-form').serialize(), function(data) {
            //call back happens here.  Unblock form/show result
        });

        return false; // this prevents regular post, forcing ajax post.

    });

</script>

REFERENCE : http://forums.asp.net/t/1611677.aspx/1?Jquery+with+ASP+NET+Form+submit

Otherwise Check : jquery + ajax combine..... http://encosia.com/using-jquery-to-directly-call-aspnet-ajax-page-methods/

answered Sep 30, 2011 at 8:57

sikender

5,9297 gold badges46 silver badges81 bronze badges

3 Comments

Amila Thennakoon Over a year ago

Thanks sikender but how can i grab the client side para meters from server side

Amila Thennakoon Over a year ago

i want to know how can i call specific asp.net server method from jquery and how can i grab that parameters?

sikender Over a year ago

you can use json for calling webmethod.

Collectives™ on Stack Overflow

How to submit asp.net form data using jquery ajax feature

2 Answers 2

2 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related