title: jquery overlay ajax form post
body: <p>im loading a external page from flowplayer overlay and im trying to submit a form in that page via ajax, and its reloading the page.</p>
  
  <p>when i browse the file directly it works fine but when its in the overlay it reloads the page on submit.</p>
  
  <p>is there anything to configure that it will load the jquery file and submit via ajax?</p>
  
  <p>thanks</p>
  
  <p>this is the code</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  
  &lt;script src="http://code.jquery.com/jquery-1.4.1.min.js"&gt;&lt;/script&gt;
  &lt;script&gt;
  $(function(){
   $("#JqAjaxForm").submit(function(){
      dataString = $("#JqAjaxForm").serialize();
  
      $.ajax({
      type: "POST",
      url: "mailto_friend.cfm",
      data: dataString,
      dataType: "json",
      success: function(data) {
  
          if(data.email_check == "invalid"){
              $("#message_ajax").html("&lt;div class='errorMessage'&gt;Sorry " + data.name + ", " + data.email + " is NOT a valid e-mail address. Try again.&lt;/div&gt;");
          } else {
              $("#message_ajax").html("&lt;div class='successMessage'&gt;" + data.email + " is a valid e-mail address. Thank you, " + data.name + ".&lt;/div&gt;");
          }
  
      }
  
      });
  
      return false;            
  
      }); 
   });
   &lt;/script&gt;
   &lt;/head&gt;
   &lt;body&gt;
  &lt;form id="JqAjaxForm"&gt;
   &lt;fieldset&gt;
   &lt;legend&gt;jQuery.ajax Form Submit&lt;/legend&gt;
   &lt;p&gt;&lt;label for="name_ajax"&gt;Name:&lt;/label&gt;&lt;br /&gt;
   &lt;input id="name_ajax" type="text" name="name_ajax" /&gt;&lt;/p&gt;
  &lt;p&gt;&lt;label for="email_ajax"&gt;E-mail:&lt;/label&gt;&lt;br /&gt;
  &lt;input id="email_ajax" type="text" name="email_ajax"  /&gt;&lt;/p&gt;
  &lt;p&gt; &lt;input type="submit" value="Submit" /&gt;&lt;/p&gt;
  &lt;/fieldset&gt;
  &lt;/form&gt;
  &lt;div id="message_ajax"&gt;&lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>this is the exact code and it has the ready function</p>
  
  <pre><code>&lt;div id="result"&gt;
  &lt;form id="testForm" &gt;my data
  &lt;/form&gt; 
  &lt;/div&gt; 
  &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script&gt; 
  $(document).ready(function() {
  $("#testForm").submit(sendForm)
  });
  
  function sendForm() {
  $.post('mypage.cfm',$("#testForm").serialize(),function(data,status){
      $("#result").html(data);
           return false;
  
  });
   return false;
  }
  
  &lt;/script&gt; 
  </code></pre>