troubleshooting Question

jQuery force form POST

Avatar of trevor1940
trevor1940 asked on
JavaScriptPHPAJAXjQuery
7 Comments1 Solution1011 ViewsLast Modified:
Hi
I have dynamically generated page with multiple forms on. When a form is submitted I wish to show a simple success / fail message within the form wrapper.

If I disable the javascript the form is received by the back end PHP via $_POST but with the javascript enabled it's received via $_GET!

How do I force the jQuery to 'post' the form?

<!doctype html>
<html>
<head>
<title>Test form</title>
<link rel="stylesheet" href="/jquery-ui-1.9.2.custom/development-bundle/themes/base/jquery.ui.all.css">
<script type="text/javascript" src="/jquery-ui-1.9.2.custom/js/jquery-1.8.3.js"></script>
<script type="text/javascript" src="/jquery-ui-1.9.2.custom/js/jquery-ui-1.9.2.custom.min.js"></script>
<script>
$(document).on("submit","form", function(evt){
  evt.preventDefault() ; // stop the form submitting
// alert($(this).attr("action") + " " + $(this).serialize() )
//Find the forms wrapper get the form's action submit it & load the responce into the forms wrapper
  $(this).closest(".FormWrap").load($(this).attr("action") + "?" + $(this).serialize() )
})

</script>

<style type="text/css">
body {
font-family:Arial;
font-size:12px;
background:#ededed;
}

#PageWrap{
width: 1000px;
margin: auto;
}

</style>
</head>
  <body>
    <div id="PageWrap">
      <header><img src="/images/Banner.jpg" > </header>
      <div class="FormWrap">
        <fieldset>
          <legend>My Form
          <legend>
          <form id="MyFrm_1"class="form" action="SubmitForm.php" method="post">
            <label for="user_1" >Name</label><input id="user_1" type="text" name="user"value ="Holly">
            <label for="age_1" >Age</label><input type="text" id="age_1" name="age" value ="23">
            <input type="submit" name="submit" value="submit" />
          </form>
        </fieldset>
      </div>
    </div>
</body>
</html>

SubmitForm.php
<?php
if(isset($_POST['Name'])){
  echo "post Name " . $_POST['Name'];
}
elseif(isset($_GET['Name'])){
  echo "GET Name " . $_GET['Name'];
}
else{
  echo "Wot no form";
}
ASKER CERTIFIED SOLUTION
Join our community to see this answer!
Unlock 1 Answer and 7 Comments.
Start Free Trial
Learn from the best

Network and collaborate with thousands of CTOs, CISOs, and IT Pros rooting for you and your success.

Andrew Hancock - VMware vExpert
See if this solution works for you by signing up for a 7 day free trial.
Unlock 1 Answer and 7 Comments.
Try for 7 days

”The time we save is the biggest benefit of E-E to our team. What could take multiple guys 2 hours or more each to find is accessed in around 15 minutes on Experts Exchange.

-Mike Kapnisakis, Warner Bros