JQuery a unique thing part- IV

Hello friends,

Today i am with new topic which is Jquery  and ajax. which is most intresting topic of mine  i am here with some basic fuction  so enjoy with this.

Ajax Functionality & JQuery

Ans:

Jquery is giving many function for using ajax which help to use ajax functionality easy. Here we goes with detail

$.ajax (s) :- its first and basic function for using ajax by Jquery.

Where s I can it collection of different properties which is enclosed in curly brackets “{ }”

1) $.ajax( {type : ” GET/POST”,

url : ” any url” ,

data : “data1=rajat& data2=test”, ( any data which you want to pass to the server…)

Success: function () {} , (any operation after successful readystate= 4)

cache : “TRUE/FALSE” ,

});

Ex:- To pass data from client to server we use following example

$.ajax({

type: “POST”,

url: “SaveUser.aspx”,

data: “name=RAJAT&Surname=JAISWAL”,

success: function(msg){

alert( “Data Saved: ” + msg );

}

} );

2)load(url) :- by the name it is clear that it will load html of a remote file and inject in current calling element.

Ex:- $(“#dvResult”).load(“htmlPage1.htm”);

it will load htmlPage1.htm ‘s html in div part

3) $.get(url) :- Simplest form to use http get request is $.get which is jquery.get(). We can send data along with this also which is optional part.

EX:- $(“save.aspx”,{name:”RAJAT”, surname:”JAISWAL”});

suppose if want to take back result from Response. Then it has following format $(“save.aspx”,{name:”RAJAT”, surname: “JAISWAL”} , function(data) { alert(‘do operation’ + data);});

4)$.getJASON(url,data,function) :- To get response in json format we use this fuction its same as $get the diffrence here is only one that its respond in Json.

Ex- suppose from server the data return in json format which is { “info”:[{ “strFirstName” :”Rajat” , “strLastName” : “Jaiswal”}]}

Then we do below code $.getJSON(“default.aspx”, function(data) { alert(data.info[0].strFirstName + data.info[0].strLastName); });

5) $.post(url,data,function):- it same as get method just a diffrence that it use post method to send data.

Ex:- $.post(“save.aspx”);

In next session i will come with simple example related to Ajax & Jquery.

Thanks

Rajat

AJAX Basic Part – III

Hi,

today we will do next  topic so lets begin

5. What is JSON ?
Ans: JSON is JavaScript Object Notation. It’s a light weight Data interchange format which is independent from language. Its easy to read & Write by human & easy to parse & genrate by language. The attributes is seprated with “,” (comma) and value of attributes are define after colon symbol(“:”) .
Ex:- {Data:[{“fname” : “RAJAT”, “Lname” : “JAISWAL” }]}
The above is JSON example in which there are two attributes fname, Lname and the are seprated by “,” (comma) symbol.
And there value is “RAJAT” & JAISWAL” which are define after “:” (colon) symbol.
I am attaching  project file just go through it.

One of the most important work here is to parse json

We do response with following format

 

 

 

 {“Bank”:[{“lngId” : “1”, “strCode” :”ICICI” ,”strBank” : “ICICI BANK” },{“lngId” : “2”, “strCode” :”HDFC” ,”strBank” : “HDFC BANK” }]}

 When we parse with json then here is the code for it.

  function myServerResponse() {
            if (myServerRequest.readyState == 4) {
                if (myServerRequest.status == 200) {
                    var tdata;
                    tdata = eval(‘(‘+ myServerRequest.responseText +’)’);
                    var intI;
                    intI = 0;
                    var strResult =”<table border=’1′ cellspacing=’4′ cellpadding=’5′><TR><TD>lngId</td><td>code</td><td>Bank</td></tr>”
                    for (intI = 0; intI <= tdata.bank.length – 1; intI++) {
                      strResult = strResult + “<tr><td>” + tdata.bank[intI].lngId + “</td><td>” + tdata.bank[intI].strCode + “</td><td>” + tdata.bank[intI].strBank + “</td></tr>”;
                    }
                   
                    strResult = strResult + “</table>”
                    document.getElementById(‘dvResult’).innerHTML = strResult;
                } else {
                    alert(‘error’);
                }
            }
            return false;

        }

 Here we first eval the responseText then  we just use it as collection array as shown in above example.

tdata.bank[0].lngId = 1

tdata.bank[0].strCode =”ICICI”

tdata.bank[0].strBank =”ICICI BANK”

in the above manner we use the Json which is meaning ful and simple format.

for more information check out the attached project. bankmasterProject

Thanks

Rajat