Ajax call to the services can be make in the following manner.

 $(function () {
            $("#callnow").click(function () {
                thirdCall();
            });
            
        });

        function thirdCall() {
            var obj1 = {
                Colour: "Red Maruti",
                Price: "2995"
            };
            $.ajax({
                type: 'POST',
                contentType: 'application/json; charset=utf-8',
                data: JSON.stringify({
                    cat: obj1
                    }),
                url: "Services/DemoService.asmx/AddCarData",
                dataType: "json",
                success: function (res) {
                    var obj = JSON.parse(res.d);
                    alert("Color: " + obj.Colour);
                },
                error: function (err) {
                    alert("err: " + JSON.stringify(err));
                }
            });
        }

        function secondCall() {
            $.ajax({
                type: "GET",
                contentType: "application/json; charset=utf-8",
                data: {"price":"200"},
                url: "Services/DemoService.asmx/GetCarByPrice",
                dataType: "json",
                success: function (res) {
                    alert("res: " + JSON.stringify(res.d));
                },
                error: function (err) {
                    alert("Error: " + JSON.stringify(err));
                }
            });
        }
        function firstCall() {
            $.ajax({
                type: "GET",
                contentType: "application/json; charset=utf-8",
                data: "{null}",
                url: "Services/DemoService.asmx/HelloWorld",
                dataType: "json",
                success: function (res) {
                    alert("res: " + res.d);
                },
                error: function (err) {
                    alert("Error: " + err);
                }
            });
        }

While the Services can handle the request from jquery in following ways.

import java.util.regex.Pattern;

using System.Diagnostics;
using System.Collections.Generic;
using System.Web.Services;
using System.Web.Script.Serialization;
using System.Web.Script.Services;

namespace DemoApp.Services
{

    public class Car
    {
        public string Colour;
        public float Price;        
    }


    // Summary description for DemoService
    
   [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 DemoService : System.Web.Services.WebService
    {

        List list = new List
        {
            new Car{Colour="Red",Price=2995f },
            new Car{Colour="Blue",Price=1995f }
        };


        [WebMethod]
        [ScriptMethod(UseHttpGet = false, ResponseFormat = ResponseFormat.Json)]
        public string AddCarData(Car cat)
        {
            Debug.Write("::::LOGGS:::: "+cat);
            Debug.WriteLine(cat.Colour+" : " + cat.Price);

            JavaScriptSerializer js = new JavaScriptSerializer();
            return js.Serialize(cat);
        }

        [WebMethod]
        [ScriptMethod(UseHttpGet = true, ResponseFormat = ResponseFormat.Json)]
        public List GetCarByPrice(float price)
        {
            Debug.Write("LOGGS:::: "+price);
            return list;
        }

        [WebMethod]
        [ScriptMethod(UseHttpGet = true, ResponseFormat = ResponseFormat.Json)]
        public string HelloWorld()
        {
            JavaScriptSerializer js = new JavaScriptSerializer();
            return js.Serialize("Hello World");
        }
    }
}

This is all we need to do.



Categories: Web

Leave a Reply

Your email address will not be published. Required fields are marked *