There would be a situation when sever would return JSON string against your request. JQuery utility function getJSON() pases the returned JSON string and makes the resulting string available to the call back function as first parameter to take further action. Syntax Here is the simple syntax for get.JSON() method: {selector}.getJSON{ URL, {data}, {callback} }; Here is the description of all the parameters: URL The URL of there sever-side resource contacted via the GET method. Data An object whose properties sever as the name/value pairs used to construct a query string to be appended to the URL, or a preformatted and encoded query string. Call-back A function invoked when the request completers. The data value resulting from digesting the response body as a JSON string is passed as the first parameter to this call-back and the status as the second. Example Consider the following HTML file with a small JQuery coding <html> <head> <title>the title </title> <script type=”text/javascript” Src=”/jquery/jquery-1.3.2.min.js”></script> <script type=”text/javascript” language =”javascript”> ${document}.ready{function}{}{ ${“#driver”}.click{function{event}{ $.gerJSON{“/jquery/result.json”,function{jd} { ${“#stage’}.html{‘<p> Name:’+jd.name: ‘+’</p>’}; ${“#stage’}.append{‘<p> Age:’+jd.age+ ’</p>’}; ${“#stage’}.append{‘<p> Sex:’ +jd.sex +’</p>’}; }}; </script> </head> <body> <p> Click on the button to load result.html file:</p> <div id=”stage” style=”background-color:blue;”> STAGE </div> <input type=”button” id=”driver” value=”Load Data”/> <body> </html> Here JQuery utility method gerJSON() intiates an Ajax request to the specified URL/jquery/result.json.file. After loading this file, all the content would be passed to the call-back function which finally would be populated inside<div>tagged with ID stage. ASssuming,oru/jquery/result.josn file has following json formatted content: { “name”: “Zara Ali”, “age”: “67”, “sex”: “female” } When you click the given button ,then result.json file gets loaded.
Many times you collect input from the user and you pass that input to the server for further processing. JQuery AJAX made it easy enough to pass collected data to the server using data parameter of any available Ajax method. Example This example demonstrate how can pass user input to a web server script which would send the same result back and we would print it: html> <head> <title>the title </title> <script type=”text/javascript” Src=”/jquery/jquery-1.3.2.min.js”></script> <script type=”text/javascript” language =”javascript”> ${document}.ready{function}{}{ ${“#driver”}.click{function{event}{ Var.name =$ (‘#name”}.val{}; ${“#stage’}.load{‘/jquery/result.php’,{“name”:name} }; }}; </script> </head> <body> <p> Enter your name and click on the button:,/p> <input type=”input “ id=”name” sixe=”40”/><br/> <div ie=”stage” style =”background-color”blue;”> STAGE </div> </input type=”button” id=”driver” value=”Show Result”/> <body> </html> Here is the code written in result.php script: <?php If { $_REQUEST{“name”} } { $name=$ _ REQUEST{‘name’ }; Echo “Welcome”.$ name; } ?> Now you can enter nay text in the given input box and then click ”Show Result” button to see what you have entered in the input box.
You liked the article?
Like: 0
Vote for difficulty
Current difficulty (Avg): Medium
TekSlate is the best online training provider in delivering world-class IT skills to individuals and corporates from all parts of the globe. We are proven experts in accumulating every need of an IT skills upgrade aspirant and have delivered excellent services. We aim to bring you all the essentials to learn and master new technologies in the market with our articles, blogs, and videos. Build your career success with us, enhancing most in-demand skills in the market.
