Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>It depends a lot on what you want todo with it, but this is a basic way of accessing the element keys. You can simply use the dot operator for each element key: "data.email" etc.</p> <pre><code>$.ajax({ type: 'POST', url: 'support.php', success: function(result) { var data = jQuery.parseJSON(result); alert(data.email); } }); </code></pre> <p>INSERT INTO HTML ELEMENT:</p> <p>I created a div with id="landingPad" and swapped out the alert line with:</p> <pre><code>$('#landingPad').html(data.email); </code></pre> <p>MAKE A LIST OF THE DATA RECEIVED:</p> <p>Then I changed my div into an unordered list:</p> <pre><code>&lt;ul id="landingPad"&gt;&lt;/ul&gt; </code></pre> <p>After changing the success function, it listed all the data received from support.php:</p> <pre><code>$(document).ready(function(){ $.ajax({ type: 'POST', url: 'support.php', success: function(result) { var data = jQuery.parseJSON(result); $.each(data, function(index, value) { $("#landingPad").append("&lt;li&gt;" + value + "&lt;/li&gt;"); }); } }); }); </code></pre> <p>CREATE FORM ELEMENTS WITH AJAX DATA:</p> <p>Next, I created the following form:</p> <pre><code>&lt;form name="http://example.com/edit_my_values" action="post"&gt; &lt;div id="landingPad"&gt;&lt;/div&gt; &lt;input type="submit" name="go" value="Edit Values"/&gt; &lt;/form&gt; </code></pre> <p>Then by editing the AJAX, I created a form on the fly with the values received:</p> <pre><code>$(document).ready(function(){ $.ajax({ type: 'POST', url: 'support.php', success: function(result) { var data = jQuery.parseJSON(result); $.each(data, function(index, value) { $("#landingPad").append('&lt;input type="input" name="'+index+'" value="'+value+'"/&gt;&lt;br/&gt;'); }); } }); }); </code></pre> <p>INSERT DATA INTO AN EXISTING FORM:</p> <p>Given the following form:</p> <pre><code>&lt;form name="http://example.com/edit_my_values" action="post"&gt; &lt;label for="error"&gt;Error &lt;/label&gt;&lt;input type="text" name="error"/&gt;&lt;br/&gt; &lt;label for="successInfo"&gt;Success &lt;/label&gt;&lt;input type="text" name="successInfo"/&gt;&lt;br/&gt; &lt;label for="email"&gt;Email &lt;/label&gt;&lt;input type="text" name="email"/&gt;&lt;br/&gt; &lt;label for="subject"&gt;Subject &lt;/label&gt;&lt;input type="text" name="subject"/&gt;&lt;br/&gt; &lt;label for="description"&gt;Description &lt;/label&gt;&lt;input type="text" name="description"/&gt;&lt;br/&gt; &lt;/form&gt; </code></pre> <p>You can fill your fields with AJAX data as follows:</p> <pre><code>$(document).ready(function(){ $.ajax({ type: 'POST', url: 'support.php', success: function(result) { var data = jQuery.parseJSON(result); $.each(data, function(index, value) { $('[name='+index+']').val(value); }); } }); }); </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload