在javascript触发时禁用提交按钮

时间:2017-05-31 08:16:22

标签: javascript php jquery

我有这样的表格:

checker_phone

<script> function checker_phone(val) { $.ajax ({ type:"POST", url:"check_phone.php", data:'phone='+val, success: function(data){ $("#msg").html(data); } }); } </script> 连接到通过另一个PHP页面运行的JavaScript。

剧本:

$phone = htmlentities($_POST['tbox_phone']);

$var_phone= mysqli_real_escape_string($connect,$phone);

$search= "SELECT * FROM users WHERE phone= '$var_phone' ";
$exec= mysqli_query($connect,$search);
$count = mysqli_num_rows($exec);

if($count==1) {      
  echo "that phone number is already registered";
}

PHP页面:

    from tinydb import TinyDB, Query

    db = TinyDB('/home/pi/Desktop/book/book.json')
    table = db.table('name')
    table.insert({'value': True})
    table.all()
    [{'value': True}]

以上代码有效。现在我想在php的计数结果返回1时禁用提交按钮。有什么办法可以吗?

Javascript很好,但我更喜欢简单的,而不是漫长而复杂的脚本。

1 个答案:

答案 0 :(得分:1)

拳头我建议在这种情况下避免内联JS只是为了更好的代码维护 第二个给你的字段和按钮一些标识符

<form action = "" method = "post">
   <input id="userPhone" type = "text" name = "tbox_phone" placeholder = "phone">
   <div id = "msg"></div>
   <input id="submitAction" type = "submit" name = "button_submit" value = "submit">
</form>

出于上述原因,将JS代码分开。

<script>
$( document ).ready(function() {
    // Event handler
    $('body').on("keyup", '#userPhone', function () {
         $('#submitAction').removeAttr('disabled'); // user is typing, reactivate the submit button
         checker_phone($('#userPhone').val());  
    });
    // Ajax handler
    function checker_phone(val)
    {
        $.ajax ({
          type:"POST",
          url:"check_phone.php",
          cache: false,
          data:{'phone':val}, // do not include parts of sql query in your JS!!!
          success: function(data){
            if(data.msg){
                $("#msg").html(data.msg);
            }
            if(!data.phoneIsUnique){
                 $('#submitAction').attr('disabled','disabled');
            }
          }
        });
    }
});
</script>

PHP代码

// connecting to db
$mysqli = new mysqli(
            $connectionData['DB_HOST'], // some array containing connection info
            $connectionData['DB_USER'],
            $connectionData['DB_PASSWORD'],
            $connectionData['DB_NAME']
        );
$mysqli->set_charset('utf8');

$resultData = ['msg'=>'','phoneIsUnique'=>true];

// parsing request
$phone = isset($_REQUEST['phone']) ? $_REQUEST['phone'] : '';

// avoid using 'SELECT *' to avoid unnecessary overhead
$stmt = $mysqli->prepare("SELECT `phone` FROM users WHERE phone=?");
$stmt->bind_param($phone); // never ever trust client input !!! so using bind.
$stmt->execute();
if($stmt->num_rows){
   $resultData = [
       'msg'=>'that phone number is already registered',
       'phoneIsUnique'=>false
   ];
}
// using Json to bounce data back to client
echo json_encode($resultData);