AJAX жить проверка доступности с кнопкой отправить

test1.phpAJAX жить проверка доступности с кнопкой отправить

<html> 
<head> 
<script type="text/javascript" src="js/jquery-1.11.1.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function(){ 
     $('#username').change(function(){ 
      var userName = $('#username').val(); 

      $.post("getUserName.php", {userName: userName}, function(data){ 
       $("#userNameCheck").html(data); 
      }); 
     }); 

     $('#submit').click(function(){ 
      //CODE HERE 

     }); 
    }); 
</script> 
</head> 

<body> 
<form action="" method="post" id="addform"> 
    Username: <input type="text" name="username" id="username" size="24" class="required" maxlength="22" /> 
    <div id="userNameCheck"></div> 
    <input type="submit" id="submit" name="submit" value="ADD user" /> 
</form> 
</body> 
</html>

getUserName.php

<?php 
include("db.php"); 

$userName = $_POST['userName']; 
$q = "select user_name from user where user_name = '".$userName."'"; 
$r = mysqli_query($dbc, $q); 

$num = mysqli_num_rows($r); 

if($num) 
{ 
     echo '<div style="color:red">Username taken. Please type another new one.  
    </div>'; 
} 
else 
{ 
     echo '<div style="color:green">You can use it.</div>'; 
} 
?>

базы данных (пользователь таблица)

user_id user_name
али
абу
Из сказанного выше:
=> тип "али" на текстовом поле -> показать "Вы можете использовать его" messsage в зеленый цвет.
=> тип ahmad в текстовом поле -> показать сообщение «Имя пользователя ...» в красном цвете.
Мое требование: если сообщение «Вы можете использовать его», перейдите к test2.php; если сообщение «Имя пользователя ...», никакая заявка на форму.
Мой вопрос: как я могу управлять сообщением «Вы можете использовать его» или «Имя пользователя», когда я нажимаю кнопку «Отправить»?

источник

2014-11-25 Michael Kuan

Вы должны использовать вызов ajax. – Gowri

Вместо использования обработчика кликов для кнопки используйте событие отправки формы.

$(document).ready(function() { 
    $('#username').change(function() { 
     var userName = $('#username').val(); 

     $.post("getUserName.php", { 
      userName: userName 
     }, function (data) { 
      $("#userNameCheck").html(data); 
     }); 
    }); 

    $('#addform').submit(function() { 
     //if the text is `You can use it` allow the form submit else block it 
     return $("#userNameCheck").html().trim() == 'You can use it'; 
    }); 
});

Кроме того, убедитесь, что вы делаете то же проверку в test2.php потому, что проверка на стороне клиента может быть сторона ступенчатой.

источник

2014-11-25 04:12:16

Хорошие ответы. Вы решили мою проблему. –

AJAX жить проверка доступности с кнопкой отправить

ответ

Смежные вопросы