Call Web Service Using Jquery Ajax
Web Service Form Addition Function Create Public and Call The One Form Using in JQuery Ajax Display Result Particular Function Calling Form Using Asp.Net C#.
Download Coding
Download
DEMO
HTML CODING
<html xmlns="http://www.w3.org/1999/xhtml">
C# CODING(WebService.asmx)
using System;
First - Add New - WebService.asmx Form
Next - Create Add Program - Public
Next - Add - New WebForm - Select TextBox & Label From ToolBox
Next - Script File Add - JQuery Plugin - Call The WebService Form - Assign Result For Label
Next - Call Function To Button
Web Service Form Addition Function Create Public and Call The One Form Using in JQuery Ajax Display Result Particular Function Calling Form Using Asp.Net C#.
Download Coding
Download
DEMO
HTML CODING
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Run JavaScript function at specific intervals of time</title>
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
function CallAddition() {
$.ajax({
type: "POST",
url: "WebService.asmx/Addition",
data: "{ 'number1': " +
$("#txtNumber1").val() + ", 'number2':
" + $("#txtNumber2").val() + "}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: OnSuccess,
error: OnError
});
}
function OnSuccess(data) {
$("#lblResults").html(data.d);
}
function OnError(request,
error) {
$("#lblResults").html("Invalid
Input");
}
function ClearTextBoxes() {
document.getElementById('txtNumber1').value
= '';
document.getElementById('txtNumber2').value
= '';
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div align="center">
<div>
<table>
<tbody>
<tr>
<td>
<asp:Label ID="Label1" runat="server" Text="Number1"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtNumber1" runat="server" />
</td>
</tr>
<tr>
<td>
<asp:Label ID="Label2" runat="server" Text="Number2"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtNumber2" runat="server" />
</td>
</tr>
<tr><td>
<asp:Label ID="Label3" runat="server" Text="Result"></asp:Label>
</td><td>
<asp:Label ID="lblResults" runat="server" Font-Size="Large" ForeColor="#CC3300"></asp:Label>
</td></tr>
<tr><td colspan="2>
<asp:Button ID="Button1" runat="server" OnClientClick="CallAddition(); return false;" Text="Add" />
<asp:Button ID="Button2" OnClientClick="ClearTextBoxes();" runat="server" Text="Reset" />
</td></tr>
</tbody>
</table>
</div>
</div>
</form>
</body>
</html>
C# CODING(WebService.asmx)
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
/// <summary>
/// Summary description for WebService
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo
= WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
//
To allow this Web Service to be called from script, using ASP.NET AJAX,
uncomment the following line.
[System.Web.Script.Services.ScriptService]
public class WebService : System.Web.Services.WebService {
public WebService () {
//Uncomment
the following line if using designed components
//InitializeComponent();
}
[WebMethod]
public int Addition(int number1,int number2)
{
return number1+number2;
}
}
First - Add New - WebService.asmx Form
Next - Create Add Program - Public
Next - Add - New WebForm - Select TextBox & Label From ToolBox
Next - Script File Add - JQuery Plugin - Call The WebService Form - Assign Result For Label
Next - Call Function To Button
0 comments:
Post a Comment