title: JavaScript get JSON from rest API without re-rendering the page
body: <h2>Problem</h2>
  <p>I'm trying to query a rest API in javascript and use jQuery to parse and insert the results into my webpage. When the query is made I believe it submits the search form and re-renders the page thus removing all of the elements I just queried and inserted.</p>
  <h3><em>Is there away to get a JSON object from a rest api and not re-render the webpage?</em></h3>
  <p>Here's what I'm using to make my requests:</p>
  <pre><code>function get_data(){
      var url = &quot;www.rest_api/search_term&amp;apikey=My_Key&quot;
      var xmlHttp = null;
      xmlHttp = new XMLHttpRequest();
      xmlHttp.open( &quot;GET&quot;, url, false );
      xmlHttp.send( null );
      return xmlHttp.responseText;
  }
  </code></pre>
  <p>The search term comes from a simple input form, and is submitted when the submit button is clicked. My goal is to keep this webpage to a single page and avoid a results page.</p>
  <h3>What I've tried</h3>
  <p><a href="https://stackoverflow.com/questions/11718904/i-cant-return-my-json-object">I can&#39;t return my json object</a></p>
  <p><a href="https://stackoverflow.com/questions/9922101/get-json-data-from-external-url-and-display-a-particular-value-by-injecting-it-i">Get JSON data from external URL and display it in a div as plain text</a></p>
  <p><a href="http://api.jquery.com/jQuery.getJSON/" rel="nofollow noreferrer">http://api.jquery.com/jQuery.getJSON/</a></p>
  <p>Request URL example:</p>
  <p><a href="http://woof.magnify.net/api/content/find?vq=karma&amp;per_page=5&amp;page=1&amp;sort=popularity&amp;key=84LTHNZQ1364W14D&amp;format=json" rel="nofollow noreferrer">http://woof.magnify.net/api/content/find?vq=karma&amp;per_page=5&amp;page=1&amp;sort=popularity&amp;key=84LTHNZQ1364W14D&amp;format=json</a></p>