wcf from jquery

Here I am assuming that readers already aware about How to create and publish a WCF service. As per the managing the data, There are two types of scenario  through WCF too.

1. Get (fetching the data) operation 

2. Post (insert, update and delete) operation

Here We will check both the scenario one by one respectively.

1. Calling a WCF service by using JQuery and perform data pulling (Get Operation)

Step 1: At first we need to add a JQuery class library, which will take all the basic references.

<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.1.min.js" type="text/javascript"></script>

Step 2: We just suppose to call a WCF service on the page load, or else you can call it on other 

           event handler like button click, change Index ...so on.

$(document).ready(

     function () {

     });

Step 3: Call a WCF through AJAX call.

     $.ajax({

             //Mention the operation type GET as data is pulling from the server

             type: "GET",

             //Content type sent to the server

             contentType: "application/json; charset=utf-8",

             //Expected result format form the server

             datatype: "json",

             //Pass the url to the service

             url: "http://localhost:8082/SampleWCF.svc/fetch?Id=10",

             beforeSend: function (req) {

                 //Show some progress bar image

                 //Do some validation like authentication(this is optional)

             },

             success: function (result, textStatus) {

                 //Hide the progress bar image

                 //Check if result is null

                 if ((result.d == null && jQuery.parseJSON(result).d.length > 0) || (result.d != null && result.d.length > 0)) {

                     //Show message for no record found

                 }

                 else {

                     //Fetch the result

                     alert(result);

//Or if result is a container then we can find the result by index also

alert(result.d[0].key; //Where key is nothing but name of the field

                 }

             }

         });

2. Calling a WCF service by using JQuery and perform data pushing (Post Operation)

Step 1 and step 2 will be same as described above

Step 3:
// Make a data set (which is required for the pushing)
var data = _EventSessionDS.data();

Step 3:

Call a WCF through AJAX call.

     $.ajax({

             //Mention the operation type GET as data is pushing to the server

             type: "POST",

             //Content type sent to the server

             contentType: "application/json; charset=utf-8",

             //Expected result format form the server

             datatype: "json",
            // If there is no need to process the data before send
            processData: false,

             //Pass the url to the service
             url: "http://localhost:8082/SampleWCF.svc/Push?Id=10",
            //Convert java script value to JSON 
            data: JSON.stringify({ pSessionsItem: data }),

             beforeSend: function (req) {

                 //Show some progress bar image

                 //Do some validation like authentication(this is optional)

             },

             success: function (result, textStatus) {

                 //Hide the progress bar image

               //show the success message

             }

         });

Delete scenario:
if we need to delete the data by calling a WCF service through JQuery then we need to just remove the data set and data from the above code.
var data = _EventSessionDS.data();
data: JSON.stringify({ pSessionsItem: data }),