title: Load an existing page/form as a modal on button click
body: <p>I have an existing webpage that contains a form for submitting questions. </p>
  
  <p><a href="http://genup.co.uk/ask-question" rel="nofollow noreferrer">Existing Form Page</a></p>
  
  <p>I want to load that form as a modal/pop-up on my homepage when someone clicks a button. </p>
  
  <p>I don't want the user to have to navigate away from the page they are on. They should be able to fill out the form and submit after clicking the button.</p>
  
  <p>I thought I could use jQuery <code>.load()</code> but I think I am using it incorrectly. </p>
  
  <p>I have placed the html/JQuery in the file containing my homepage. </p>
  
  <p>I am not sure what to put as an argument in <code>.load()</code>, the page url or the file? I have tried both and neither work. </p>
  
  <p><a href="http://genup.co.uk/questions" rel="nofollow noreferrer">Homepage</a> </p>
  
  <pre><code>&lt;div id="PopUpForm"&gt;Pop Up Form&lt;/div&gt;
  &lt;a href="#" onclick="openDialog();"&gt;Button&lt;/a&gt;
  
   &lt;script type="text/javascript"&gt;
  function openDialog() {
     $("#PopUpForm").load('question-submit-form.php').dialog({modal: true});
  } 
  &lt;/script&gt;
  </code></pre>