Question

For this demo I am getting inputs from a form, putting them in a json object and sending via ajax to a server. How can i repopulate a form with the data on the server? I can get it to print in the console but cant seem to figure out how to get it in a form. is it as simple as putting something like jsonObject.firstName somewhere in the form field?

form:

div class="form">      
      <form method="GET" action="demo.html">  
      <section class="formSection">  
        <div class="dataChunk">
          <label for="firstName">First Name:</label>
          <input type="text"  id="jsonObject.firstName" maxlength="50" />  
        </div>                    
        <div class="dataChunk">    
          <label for="lastName">Last Name:</label>         
          <input type="text"  id="lastName" maxlength="50" />  
        </div>       
        <div class="dataChunk">   
          <label for="phoneNumber">Phone:</label>
          <input type="text"  id="phoneNumber" maxlength="10" />
        </div>             
        <div class="dataChunk">   
          <label for="address">Address:</label>
          <input type="text"  id="address" maxlength="50" />
        </div>  
       </section>                  
    </form> 
  </div>

json object

var jsonObject = {
  "firstName" : firstName, 
  "lastName" : lastName,
  "phone" : phone,
  "address" : address
  };

php

$name = $_REQUEST['firstName']." ".$_REQUEST['lastName'];
$phone = $_REQUEST['phone'];
$address = $_REQUEST['address'];

$person = Array();
$person['name'] = $name;
$person['phone'] = $phone;
$person['address'] = $address;

$returnObj = json_encode($person);
echo $returnObj;
?>

Answer 1

You would need to iterate thru your php json encoded return using $.each and update your form elements by selector

 $(document).ready(function() {
    $('form').submit( function(){
      var values = serialize( $(this) );
      $.ajax({
         url: 'demo.php'
         data: values,
         Success: function(result){
           $.each(result, function( key, value ) ({
            $('#'+key).val(value); 
           });
         }
      });
     });
  });

Untested as i’m on a mobile device, but general layout is there,i’ll update if i make any syntax errors

placing jsonobject in front of your element id will not auto parse the json returned object