2016-04-03 40 views
0

我正在使用此腳本來檢查用戶名可用性,它可以工作,但即使用戶名不可用,表單也會提交。我試圖使用event.preventdefault,但是,我不知道如何正確使用它我怎樣才能防止表單被提交?如果用戶名不可用,jquery ajax會阻止表單提交

<script> 
    function checkAvailability() { 
     $("#loaderIcon").show(); 
     jQuery.ajax({ 
      url: "check_availability.php", 
      data: 'username=' + $("#username").val(), 
      type: "POST", 
      success: function(data) { 
       $("#user-availability-status").html(data); 
       $("#loaderIcon").hide(); 
      }, 
      error: function() {} 
     }); 
    } 
</script> 

這裏是形式

<form id="defaultForm" action="index1.php" method="post" class="registration-form"> 
    Username 
    <br> 
    <input type="text" name="username" onBlur="checkAvailability()" id="username"> 
    <br><span id="user-availability-status"></span> Password 
    <br> 
    <input type="text" name="email" id="email"> 
    <br> 
    <button type="submit" name="sub">Submit</button> 

這裏是check_availability.php

<?php 
    require_once("connect.php"); 
    if(!empty($_POST["username"])) { 
     $result = mysqli_query($con,"SELECT count(*) FROM users WHERE username='" . $_POST["username"] . "'"); 
     $row = mysqli_fetch_row($result); 
     $user_count = $row[0]; 
     if($user_count>0) { 
     echo "<span class='status-not-available'><p style='text-align:center'> Username Not Available</p></span>"; 
     } 
    } 
?> 
+2

請縮進代碼,並告訴我們完整的代碼。 「checkAvailability」在哪裏調用? – Technoh

+0

Umm ofcourse它does.You需要使用preventDefault,檢查成功返回的價值,如果它是正確的,提交表格 – Mihai

+0

@Mihai我試過了,但我不知道在哪裏使用它.. –

回答

0

在HTML中刪除函數調用

$(document).ready(function(){ 

    $("#defaultForm").submit(function(e) { 
    e.preventDefault(); 
    $("#loaderIcon").show(); 
    var self = this; 
    $.ajax({ 
      url: "check_availability.php", 
      data: 'username=' + $("#username").val(), 
      type: "POST"     
    }).success(function(data) { 
     $("#user-availability-status").html(data); 
       $("#loaderIcon").hide(); 
     if (data!= "<span class='status-not-available'><p style='text-align:center'> Username Not Available</p></span>") 
      self.submit(); 
    }).error(function() { 
     alert('error'); 
    }); 
}); 

}); 
+0

它仍然被提交,現在它不檢查用戶名.. –

+0

@MahimParsai使用類似httpfox for firefox to see the headers.To be clear do you want the from if submitted it'username not Available'or not?如果是,請將'data!='更改爲'data ==' – Mihai

+0

如果用戶名不可用,那麼表單不應該提交4 –

相關問題