title: php + Ajax + Json page submit
body: <p>I have a business functionality to do Employee search (Ajax), on submitting the form. I have to load employee details by using JQuery based Ajax.
  Following is my search code. The issue is after submitting the form, <code>&lt;div id="emp"&gt;&lt;/div&gt;</code> is not populated with values. in <code>Employee.php</code> page I see json object, was able to print employees.</p>
  
  <p>I guess below form is submitting, but not returning to page after json object is created. Could someone help me how can I make this as ajax based call.</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;title&gt;&lt;/title&gt;
  &lt;script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  
      $(document).ready(function () 
      {
          //alert('test');
          $(".js-ajax-php-json").submit(function(){
              alert('test');
              $.getJSON("Employee.php", function (jsoncontent)
              {
                  alert(jsoncontent);
                  jsonArray = jsoncontent;
  
                  for(var i =0;i &lt; jsonArray.length-1;i++)
  {
    var emp = jsonArray[i];
     $("#emp").html(i+" "+emp[0].lastname + " - " + emp[0].firstname+ " - " ); 
  }
     });
     });
     });
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
   &lt;form class="js-ajax-php-json" action="Employee.php" method="GET"&gt;
           &lt;div class="input-group"&gt;
              &lt;input type="text" class="form-control" style='width:300px' name="srch-term" id="srch-term" placeholder="Enter the Employee Name"&gt;
              &lt;span class="input-group-btn"&gt;&lt;input type="submit"  value="search" class="btn btn-success"&gt;&lt;/input&gt;&lt;/span&gt;
            &lt;/div&gt;
          &lt;/form&gt;
  &lt;div id="emp"&gt;&lt;/div&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>