2016-06-07 59 views
4

我正在開發一個應用程序,使用ajax發送表單數據。成功函數數據添加到數據庫後,但它不顯示任何消息和完整的表單數據附加到URL。 在這我使用「POST」方法。 爲什麼這個數據附加到窗體並且不顯示任何消息結果字段。提交表單後使用post方法表單數據附加到php中的url爲什麼?

這是我的html代碼

<form class="form-horizontal form-label-left" id="myForm" novalidate> 
    <span class="section">Personal Info</span> 

    <div class="item form-group"> 
     <label class="control-label col-md-3 col-sm-3 col-xs-12" for="fname"> First Name <span class="required">*</span> 
     </label> 
     <div class="col-md-6 col-sm-6 col-xs-12"> 
      <input id="fname" class="form-control col-md-7 col-xs-12" data-validate-length-range="6" data-validate-words="1" name="fname" placeholder="First Name" required="required" type="text"> 
     </div> 
    </div> 

    <div class="item form-group"> 
     <label class="control-label col-md-3 col-sm-3 col-xs-12" for="lname"> Last Name <span class="required">*</span> 
     </label> 
     <div class="col-md-6 col-sm-6 col-xs-12"> 
      <input id="lname" class="form-control col-md-7 col-xs-12" data-validate-length-range="6" data-validate-words="1" name="lname" placeholder="Last Name" required="required" type="text"> 
     </div> 
    </div> 
    <div class="item form-group"> 
     <label class="control-label col-md-3 col-sm-3 col-xs-12" for="username"> Username <span class="required">*</span> 
     </label> 
     <div class="col-md-6 col-sm-6 col-xs-12"> 
      <input id="username" class="form-control col-md-7 col-xs-12" data-validate-length-range="0,25" data-validate-words="1" name="username" placeholder="Username" required="required" type="text"> 
     </div> 
    </div> 
    <div class="item form-group"> 
     <label class="control-label col-md-3 col-sm-3 col-xs-12" for="email">Email <span class="required">*</span> 
     </label> 
     <div class="col-md-6 col-sm-6 col-xs-12"> 
      <input type="email" id="email" name="email" required="required" class="form-control col-md-7 col-xs-12" placeholder="[email protected]"> 
     </div> 
    </div> 
    <div class="item form-group"> 
     <label for="password" class="control-label col-md-3">Password <span class="required">*</span></label> 
     <div class="col-md-6 col-sm-6 col-xs-12"> 
      <input id="password" type="password" name="password" data-validate-length="6,8" class="form-control col-md-7 col-xs-12" required="required"> 
     </div> 
    </div> 
    <div class="item form-group"> 
     <label for="password2" class="control-label col-md-3 col-sm-3 col-xs-12">Repeat Password</label> 
     <div class="col-md-6 col-sm-6 col-xs-12"> 
      <input id="password2" type="password" name="password2" data-validate-linked="password" class="form-control col-md-7 col-xs-12" required="required"> 
     </div> 
    </div> 
    <div class="item form-group"> 
     <label class="control-label col-md-3 col-sm-3 col-xs-12" for="telephone">Telephone <span class="required">*</span> 
     </label> 
     <div class="col-md-6 col-sm-6 col-xs-12"> 
      <input type="tel" id="telephone" name="telephone" required="required" data-validate-length-range="8,20" class="form-control col-md-7 col-xs-12"> 
     </div> 
    </div> 
    <div class="item form-group"> 
     <label class="control-label col-md-3 col-sm-3 col-xs-12" for="status">Status</label> 
     <div class="col-md-6 col-sm-6 col-xs-12"> 
      <select id="status" name="status" class="form-control col-md-7 col-xs-12"> 
       <option>Select Status</option> 
       <option value="ACTIVE" >Active</option> 
       <option value="INACTIVE">Inactive</option> 
       <option value="VACATION">Vacation</option> 
      </select> 
     </div> 
    </div> 
    <div class="item form-group"> 
     <label class="control-label col-md-3 col-sm-3 col-xs-12" for="role">Role</label> 
     <div class="col-md-6 col-sm-6 col-xs-12"> 
      <select id="role" name="role" class="form-control col-md-7 col-xs-12"> 
       <option value="ACTIVE" >Select Role Name</option> 
       <option value="Manager" >Manager</option> 
       <option value="Operator">Operator</option> 
       <option value="Admin">Admin</option> 

      </select> 
     </div> 
    </div> 

    <div class="ln_solid"></div> 
    <div class="form-group"> 
     <div class="col-md-6 col-md-offset-3"> 
      <button type="reset" id="reset" class="btn btn-primary">Cancel</button> 
      <button id="send" type="submit" class="btn btn-success">Submit</button> 
     </div> 
    </div> 

    <div id="result"></div> 
</form> 

提交後,我打電話在我使用ajax的js文件。

AJAX功能

function processForm(e){ 
    alert(e); 
    $.ajax({ 
     url: 'add_user_check.php', 
     dataType: 'text', 
     type: 'post', 
     contentType: 'application/x-www-form-urlencoded', 
     data: $(this).serialize(), 
     success: function(data, textStatus, jQxhr) 
     { 
      alert(data); 
      var split = data.split(','); 
      var display = split[0]; 
      var msg = split[1]; 

      $('#result').html(msg); 



     }, 
     error: function(jqXhr, textStatus, errorThrown){ 
      $('#result').html("Connection error :"+errorThrown); 

     } 
    }); 

    e.preventDefault(); 
} 

$('#myForm').submit(processForm); 

如果數據提交成功返回成功的消息,並顯示導致現場。但消息不顯示並且完整的數據附加到該URL。如圖所示。 enter image description here 爲什麼會發生這種情況?以及爲什麼它不顯示正確的消息結果字段。

在此先感謝。

+0

你能分享你的PHP的數據?至少是迴應? – Jurik

+1

你應該在你的processForm函數'e.preventDefault()'中防止默認使用表單,否則你的表單也會被提交。 – Jurik

+0

您的表單正在被提交,並且您的ajax函數從未被調用過,或者您的ajax函數被調用後表單被提交。 – Poria

回答

1

以html形式使用method =「post」。

+0

他寫道,數據保存到數據庫和他使用ajax的方式,他不需要窗體方法。 – Jurik

3

總之,因爲沒有真正的錯誤。 PHP沒有處理您的請求,因此正常開展業務。該URL的POST數據通常會停留在那裏,只是因爲它未被重定向而沒有被刷新。

這是因爲您實際上沒有爲窗體指定方法。

您需要使用

<form method="post" ....

+0

他寫道,數據保存到數據庫和他使用ajax的方式,他不需要窗體方法。 – Jurik