Ajax POST form to PHP

本文关键字：PHP to form POST Ajax | 更新日期: 2023-09-27

尝试使用Ajax发布我的表单。使用ApacheCordova，但似乎无法将其发送到我的php表单。任何关于如何使我的表单工作的想法都将不胜感激。

  <script type="text/javascript">    
$('#userform').submit(function(){
    var postData = $(this).serialize();
    $.ajax({
        type: 'POST',
        data: postData,
        url: 'http://myurl/dbInsertUserslocal.php',
        success: function(data){
            console.log(data);
            alert('User successfully added');
        },
        error: function(){
            console.log(data);
            alert('There was an error adding New User');
        }
    });
    return false;
});
</script>

我的表格看起来像：

      <form id="userform" method="Post">
      <div class="row">
    <div class="large-4 columns">
      <label>First/Last Name
        <input type="text" name="firstlast" />
      </label>
    </div>
      </div>
    <div class="row">
    <div class="large-2 columns">
      <label>Title
        <select name="title" >
          <option value=""></option>
          <option value="Inspector">Inspector</option>
          <option value="Tech">Technician</option>
          <option value="Supervisor">Supervisor</option>
        </select>
      </label>
  </div>
  </div>
    <div class="row" >
        <div class="large-12 columns">  
           <hr class="intro-divider">
                <input type="file" capture="camera" accept="image/*" 
                     id="snap" name="photo">
                      </div>
                           </div>
               <hr class="intro-divider">   
           </div>
         </div>
       <div class="row">
    <div class="large-2 columns">
        <button class="tiny" type="submit" value="Submit" 
             id="submit" data-role="button" data-ajax="false">Add User</button>
    </div>
     </div>
    </form>

如果在表单中包含文件，则必须使用multipart/form-data。

<form id="userform" method="Post" enctype="multipart/form-data">

serialize方法无法查看文件数据。通过使用FormData对象而不是serialize方法，javascript代码变为

$(function(){
$('#userform').submit(function(){
    var fd = new FormData( $(this)[0] );
    $.ajax({
        type: 'POST',
        processData: false,
        contentType: false,
        data: fd,
        dataType: "text",
        url: 'http://myurl/dbInsertUserslocal.php',
        success: function(data){
            alert( data );
            alert('User successfully added');
        },
        error: function(){
            alert('There was an error adding New User');
        }
    });
    return false;
});
});