In normal ASP.NET web forms, if you want to send any data to server your web page will be refreshed i.e. will do a post back.
In some case, if you want to send data to the server without using any post back then in this case you have to use a web method at server side and that will be called from jQuery side.
How to implement ASP.Net web method using JQuery AJAX?
HTML Page:
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<title></title>
<script src=”js/jquery.min.js”></script>
<script>
function SubmitData() {
var name = ‘Ram’;
var gender = ‘Male’;
var age = ’30’;
$.ajax({
type: “POST”,
url: “ajaxcall.aspx/SaveData”,
data: ‘{“name”:”‘ + name + ‘”, “gender”:”‘ + gender + ‘”, “age”:”‘ + age + ‘”}’,
contentType: “application/json; charset=utf-8”,
dataType: “json”,
beforeSend: function () {
$(‘#loader’).show();
},
success: function (data) {
alert(data.d);
$(‘#loader’).hide();
},
error: function (msg) {
//alert(‘3’);
msg = “There is an error”;
alert(msg);
$(‘#loader’).hide();
}
});
}
</script>
</head>
<body>
<div id=”loader” style=”display: none;“>
<img src=”ajax-loader.gif” />
</div>
<a href=”#” onclick=”SubmitData();”>Submit</a>
</body>
</html>
WebMethod
[WebMethod]
public static string SaveData(string name, string gender, string age)
{
try
{
return “OK”;
}
catch (Exception ex)
{
return ex.Message;
}
finally
{
}
}