Question

我正在尝试将数据从html表单发布到php页面。

以下是表格：

<form onSubmit="return validEmail()" style="text-align:center; clear:both">        
        <input type="text" id="ms_firstName" name="ms_firstName" required placeholder="First Name" style="float:left;" >  
        <input type="text" id="ms_lastName" name="ms_lastName" required style="float:left; margin-left:20px;" placeholder="Last Name"> 
        <input type="email" id="ms_email" name="ms_email" required placeholder="Corporate Email address" pattern="^.*(\w+@barclays|\w+@barcap.com).*$" oninvalid="this.setCustomValidity('Please enter your corporate email')" style="float:left; margin-top: 10px;">
        <input type="password" id="ms_password" name="ms_password" required style="clear:right; margin-top: 10px; margin-left: 20px;" placeholder="Password" pattern=".{6,}">
        <input type="submit"  name="submit" style="alignment-adjust:central; margin-top:30px; clear:right;" ><br>    
     </form>

这是ajax：

  $.ajax({ 
        url: "/ms_form_handler.php",
        method:"POST",
        data: "{'ms_firstName':'" + ms_firstName+ "', 'ms_lastName':'" + ms_lastName+ "', 'ms_email':'" + ms_email+ "', 'ms_password':'" + ms_password+ "'}",
        success: function (){
            alert('form was submitted succesfully');
        }
             });

以下是php拾取字段名称：

if($_POST && isset($_POST['submit'], $_POST['ms_firstName'], $_POST['ms_lastName'], $_POST['ms_email'], $_POST['ms_password']`)){}

任何帮助都将不胜感激。

Answer 1

您应该开始使用以下方式从FORM获取数据：

<强> EDITED

ms_firstName = $('#ms_firstName').val();
ms_lastName = $('#ms_lastName').val();
ms_email = $('#ms_email').val();
ms_password = $('#ms_password').val();

并使用它来发送AJAX请求：

$('form').submit(function(){
  $.ajax({ 
    url: "/ms_form_handler.php",
    method:"POST",
    data: "{ms_firstName: ms_firstName, ms_lastName: ms_lastName, ms_email: ms_email, ms_password: ms_password}",
    success: function (){
        alert('form was submitted succesfully');
    }
   });
});

Answer 2

首先，您在data属性中传递的是字符串而不是对象。您可以像这样修改代码：

HTML表格：：

    <form onSubmit="return validEmail()" style="text-align:center; clear:both">
        <input type="text"      id="ms_firstName"   name="ms_firstName" required placeholder="First Name" style="float:left;" >
        <input type="text"      id="ms_lastName"    name="ms_lastName" required style="float:left; margin-left:20px;" placeholder="Last Name">
        <input type="email"     id="ms_email"       name="ms_email" required placeholder="Corporate Email address" pattern="^.*(\w+@barclays|\w+@barcap.com).*$" oninvalid="this.setCustomValidity('Please enter your corporate email')" style="float:left; margin-top: 10px;">
        <input type="password"  id="ms_password"    name="ms_password" required style="clear:right; margin-top: 10px; margin-left: 20px;" placeholder="Password" pattern=".{6,}">
        <input type="submit"    name="submit" style="alignment-adjust:central; margin-top:30px; clear:right;" ><br>
    </form>

JQUERY CODE：：

    <script type="text/javascript">
        var ms_firstName    = $("#ms_firstName").val();
        var ms_lastName     = $("#ms_lastName").val();
        var ms_email        = $("#ms_email").val();
        var ms_password     = $("#ms_password").val();
        $.ajax({
            url     : "/ms_form_handler.php",
            method  : "POST",
            data    : { // THE data PROPERTY IS EXPECTED TO BE AN OBJECT & YOU PASSED A STRING...
                ms_firstName    : ms_firstName,
                ms_lastName     : ms_lastName,
                ms_email        : ms_email,
                ms_password     : ms_password
            },

            success: function (){
                alert('form was submitted succesfully');
            }
        });
    </script>

通过Ajax将表单数据发布到php？

2 个答案: