javascript - jQuery 表单,存在检查

标签 javascript php jquery mysql forms

所以我正在创建一个简单的表单,使用 jQuery 检查用户输入的值是否存在于我的数据库中。到目前为止一切正常,但我发现自己陷入了下一部分。

为了便于解释,我将仅展示我正在尝试实现的目标的示例。 对于这个例子,我将是“weeden”

weeden 在我的数据库的公司表中的 ID 为 255。

  1. 如果用户在客户端字段中输入“weeden”
  2. 在客户字段的右侧(在网络表单上),文本“weeden is unavailable”将出现

我希望发生的是:“ID 255 不可用”

这是相关代码。

HTML 格式

<form action="addrecord.php" method="post" autocomplete="off"/>  
<div class="form-field">
  <label for="client">Client: </label>
  <input type="text" name="client" id="client" class="check-exists" data-type="client" placeholder="#">
  <span class="check-exists-feedback" data-type="client"></span>
</div>

jQuery 函数

$.fn.existsChecker = function(){
  return this.each(function(){   
        var interval;

        $(this).on('keyup', function(){
            var self = $(this),
                selfType = self.data('type'),
                selfValue,
                feedback = $('.check-exists-feedback[data-type=' + selfType + ']');

            if(interval === undefined){
                interval = setInterval(function(){

                  if(selfValue !== self.val()){
                      selfValue = self.val();

                      if(selfValue.length >= 1){
                          $.ajax({
                              url: 'check.php',
                              type: 'get',
                              dataType: 'json',
                              data: {
                                    type: selfType,
                                    value: selfValue
                              },
                              success: function(data){
                                  if(data.exists !== undefined){
                                      if (data.exists === true){
                                          feedback.text(selfValue + ' is already taken.');
                                      }else {
                                          feedback.text(selfValue + ' is available');
                                      }
                                  }
                              },
                              error: function(){

                              }
                           });
                       }
                  }
              }, 1000);
          }
      });
  });
};

Check.php

$db= new PDO('mysql:host=host;dbname=mydb', 'user', 'pass');

if(isset($_GET['type'], $_GET['value'])){

$type = strtolower(trim($_GET['type']));
$value= trim($_GET['value']);

$output = array('exists' => false);


if(in_array($type,
            array('client')
            )
   ){

  switch($type){
      case 'client':
           $check = $db->prepare("
                SELECT COUNT(*) AS count
                FROM company
                WHERE name = :value
            ");
       break;

$check->execute(array('value'=> $value));
$output['exists'] = $check->fetchObject()->count ? true: false;
echo json_encode($output);

如有任何帮助/建议,我们将不胜感激。我认为自己是初学者,这是我第一次从事网络项目。

提前澄清一下,同一个网络表单上还有许多其他输入字段,例如:电子邮件、日期、姓名、姓名等。 我希望我的问题足够清楚。谢谢

最佳答案

您必须将查询更改为如下内容:

$check = $db->prepare("
            SELECT id, COUNT(*) AS count
            FROM company
            WHERE name = :value
        ");

我假设您在 company 表中的主键字段名为 id

最后将 id 存储在 output-Array

$result = $check->fetchObject();
$output['exists'] = $result->count ? true: false;
$output['id'] = $result->id;

然后你可以像这样输出id:

if (data.exists === true){
  feedback.text('ID ' + data.id + ' is unavailable');
}

关于javascript - jQuery 表单,存在检查,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29435752/

相关文章:

javascript - 强制 iFrame 作为移动设备

javascript - 用 jQuery 替换对象中的值

javascript - 静态站点表单到电子邮件 Eloquent 解决方案?

javascript - IE8 的 document.domain "permission denied"问题

php 到 excel - 德语元音变音

php - 在服务器上执行 php 脚本非常慢

php - 禁用 Codeigniter 日志记录并允许原生 PHP 日志记录

javascript - 在 Google Apps 脚本中定义多个范围

javascript - 防止 symfony 提交表单上的事件

javascript - Node.js 新手;需要帮助将 npm 模块导入我的前端 vanilla JS 项目