php - 自动完成同一文件中的 2 个文本框

标签 php jquery

我有一个自动完成代码,在查询一个文本框时工作得很好,但是当尝试自动填充两个文本字段时,两个文本字段都使用相同的 URL,第一个返回第二个框中的值,如屏幕截图所示下面:

enter image description here

代码如下:

index.php

$(document).ready(function() {
  $("#search-box").keyup(function() {
    $.ajax({
      type: "POST",
      url: "readCountry.php",
      data: 'keyword=' + $(this).val(),
      beforeSend: function() {
        $("#search-box").css("background", "#FFF url(LoaderIcon.gif) no-repeat 165px");
      },
      success: function(data) {
        $("#suggesstion-box").show();
        $("#suggesstion-box").html(data);
        $("#search-box").css("background", "#FFF");
      }
    });
  });
});

function selectCountry(val) {
  $("#search-box1").val(val);
  $("#suggesstion-box1").hide();
}

$(document).ready(function() {
  $("#search-box1").keyup(function() {
    $.ajax({
      type: "POST",
      url: "readCountry.php",
      data: 'keyword=' + $(this).val(),
      beforeSend: function() {
        $("#search-box1").css("background", "#FFF url(LoaderIcon.gif) no-repeat 165px");
      },
      success: function(data) {
        $("#suggesstion-box1").show();
        $("#suggesstion-box1").html(data);
        $("#search-box1").css("background", "#FFF");
      }
    });
  });
});

function selectCountry(val) {
  $("#search-box").val(val);
  $("#suggesstion-box").hide();
}
body {
  width: 610px;
}
.frmSearch {
  border: 1px solid #F0F0F0;
  background-color: #C8EEFD;
  margin: 2px 0px;
  padding: 40px;
}
#country-list {
  float: left;
  list-style: none;
  margin: 0;
  padding: 0;
  width: 190px;
}
#country-list li {
  padding: 10px;
  background: #FAFAFA;
  border-bottom: #F0F0F0 1px solid;
}
#country-list li:hover {
  background: #F0F0F0;
}
#search-box {
  padding: 10px;
  border: #F0F0F0 1px solid;
}
<html>

<head>
  <TITLE>jQuery AJAX Autocomplete - Country Example</TITLE>

  <head>

    <body>
      <div class="frmSearch">
        <input type="text" id="search-box" placeholder="Country Name" />
        <div id="suggesstion-box"></div>
        <input type="text" id="search-box1" placeholder="Country Name" />
        <div id="suggesstion-box1"></div>
      </div>
    </body>

</html>

readCountry.php

           <?php

    if(!empty($_POST["keyword"])) {

    $Name=$_POST["keyword"];
    $username="********";
    $password="********";
    $lc = ldap_connect("********") or
    die("Couldn't connect to AD!");
    ldap_set_option($lc, LDAP_OPT_PROTOCOL_VERSION, 3);
    ldap_bind($lc,$username,$password);
    $base = "OU=********,DC=********,DC=********";
    $filt = "(&(&(&(objectCategory=person)(objectClass=user)(name=$Name*))))";
    $sr = @ldap_search($lc, $base, $filt);
    $info = ldap_get_entries($lc, $sr);
    for ($i = 0; $i < $info["count"]; $i++) {
   <li onClick="selectCountry('<?php echo $info[$i]["cn"][0] ?>');"><?php echo $info[$i]["cn"][0] ?></li>
    }
    if ($i == 0) {
    echo "No matches found!";
    } }

我需要什么:

它应该在各自的文本框中返回每个搜索到的值。

enter image description here

感谢任何帮助:) 提前致谢! :)

最佳答案

我有重复的函数名称和文件名。分离文件,它开始工作得很好! :)

  $(document).ready(function() {
    $("#search-box").keyup(function() {
    $.ajax({
      type: "POST",
      url: "readCountry1.php",
      data: 'keyword=' + $(this).val(),
      beforeSend: function() {
        $("#search-box").css("background", "#FFF url(LoaderIcon.gif) no-repeat 165px");
      },
      success: function(data) {
        $("#suggesstion-box").show();
        $("#suggesstion-box").html(data);
        $("#search-box").css("background", "#FFF");
      }
    });
    });
   });

    function selectCountry1(val) {
    $("#search-box1").val(val);
    $("#suggesstion-box1").hide();
   }

$(document).ready(function() {
  $("#search-box1").keyup(function() {
    $.ajax({
      type: "POST",
      url: "readCountry.php",
      data: 'keyword=' + $(this).val(),
      beforeSend: function() {
        $("#search-box1").css("background", "#FFF url(LoaderIcon.gif) no-repeat 165px");
      },
      success: function(data) {
        $("#suggesstion-box1").show();
        $("#suggesstion-box1").html(data);
        $("#search-box1").css("background", "#FFF");
      }
    });
    });
    });

function selectCountry(val) {
  $("#search-box").val(val);
  $("#suggesstion-box").hide();
}

关于php - 自动完成同一文件中的 2 个文本框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32203520/

相关文章:

php - 查询在 PHPmyadmin 中有效,但在 PHP 脚本中无效

javascript - 用于普通数据到 xml 数据的图像 slider

javascript - 我希望我的 Controller 在执行其他操作之前等待我的指令完成

php - 带有可选参数的 Laravel 函数

php - Flutter/Dart AES-256-CBC 从 PHP 加密解密

javascript - 如何从 mysql 在图形栏中显示数据

javascript - 从下拉列表中选择路径元素的值时,如何更改路径元素的颜色

javascript - 使用 jQuery 更改 div 的内容

jquery - 控制jQuery异步ajax调用次数?

php - 两个表中的数据在连接时复制