Calling Web Services from the Client using jQuery

By -
1. .ASMX page - Web Service Code:

[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 QuotationService : System.Web.Services.WebService
    {
        [WebMethod]
        public string GetQuote()
        {
            List<string> quotes = new List<string>();
            quotes.Add("The fool who is silent passes for wise.");
            quotes.Add("The early bird catches the worm.");
            quotes.Add("If wishes were true, shepherds would be kings.");
            Random rnd = new Random();
            return quotes[rnd.Next(quotes.Count)];
        }
    }


2. .ASPX Page - Calling web service using jQuery

 
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>Show Web Service Methodtitle>
    <script type="text/javascript" src="../Scripts/jquery-1.4.1.js">script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#btnGet").click(function () {
                $.ajax({//makes an asynchronous call to a URL.
                    type: "POST",
                    dataType: "json",
                    contentType: "application/json",
                    url: "QuotationService.asmx/GetQuote",
                    success: function (data) {
                        $("#spanQuote").html(data.d);
                    },
                    error: function () {
                        alert("The call to the web service failed.");
                    }
                })
            });
        });
    script>
head>
<body>
    <form id="form1" runat="server">
    <div>
        <input id="btnGet" type="button" value="Get Quote" />
        <br />
        <br />
        <span id="spanQuote">span>
    div>
    form>
body>
html>




Comments

Post a Comment

Popular posts from this blog

Fiserv Interview Questions.

By -
1) For edit functionality in DataGird specify Column name 2) Why you may not want to use Paging funtionality in data grid 3) Function of SqlCommanBuilder in code. 4) Find the error in code . Its related to database connection. I think that connection sould be closed in finally instead of try. 5) What is the relation between src='' & Inherits='' in <@ Page > directive 6) What is derective in the user control page & its extention of file 7) Question related to 404 error code Error page & Default error page. 8) Its related to Autherization in web config related to folders 9) Related to definition 10) not remembred with question but answer is cookiless = true related question 11) Page is posting the 2 times why is it so 1) user control load 2) some control call load 12) describe !Page.PostBack Select Options 13) Question related to Session mode = SQLServer 14) Some question related to validation control - compare validator 15) Some question ...
Read more

Dependency Injection

By -
Image
Replace dependencies with Dependency Injection to make your classes easier to reuse and test. The dependency injection pattern, is one of the most popular design paradigms today. It facilitates the design and implementation of loosely coupled , reusable , and testable objects in your software designs by removing dependencies that often inhibit reuse. Dependency injection can help you design your applications so that the architecture links the components rather than the components linking themselves. Samples used for this presentation:  DI_Demo.zip
Read more

AngularJs - Simple Example

By -
In Angular "-" is used because HTML specification says that anything with - will not be parsed by HTML. Means If you will use - in element naming then other needs to parse it. So in thins case Angular will parse elements. $scope - Is a Angular Service for a scope management. As per the following code, Each ng-controller scope is different. $scope is parameter for your function and angular will inject $scope object into your function. $rootScope - Application have only one rootScope and which is global. This code will create object of customer class  and this controller will have his scope under that scope he do have access to Customer Name and Customer Code.  <div  ng-controller ="customerObj">  $scope.$watch ("CustomerAmount", function() - This is the customer watch code ng-App - In one HTML file you can have only one ng-app. ::  is considered a one-time expression. One-time expressions will stop recalculating once they are stable, ...
Read more