用php mysql jquery ajax动态更新选择框

Question

我试图通过PHP通过PDO MySql的结果填充初始客户选择框。 然后，我希望第二个联系人选择框更新为与第一个框中选择的内容有关的其他信息。 我无法使用第二个脚本。 我认为问题出在我的ajax脚本中，因为单独运行PHP脚本可以正常工作。

主要脚本

 <html>
<head>
    <script type="text/javascript" src="js/jquery-1.11.0.js"></script>
    <script type="text/javascript" src="js/jquery-ui-1.10.4.custom.js"></script>

    <script type="text/javascript">
        $(document).ready(function(){
            $("#contact").change(function(){
                 var cid = $("#cid").val();
                 $.ajax({
                    type:"post",
                    url:"contact.php",
                    data:"cid="+cid,
                    success: function(data) {
                      $("#contact").html(data);
                    }
                 });
            });
       });
    </script>
 </head>
 <body>

    Campaign :
    <select name="customer" id="customer">
      <option>-Select a Customer-</option>
    <?php 
    include ("function.php");
  include("connect.php");
    $id = $_SESSION['profile']['id']; 
   foreach($db->query("SELECT * FROM customers WHERE pid = '$id'") as $row) {
        echo "<option value=" . $row['id'] . ">" . $row['name'] . "</option>";
}
        ?>
    </select>



    <select name="contact" id="contact">
        <option>-Select a Contact-</option>
    </select>
  </body>
</html>

联系人脚本

    include("connect.php");
$cid = $_POST["cid"];
foreach($db->query("SELECT * FROM contact WHERE cid = '$cid'") as $row) {
    echo '<option value="'.$row['id'].'">'.$row['name'].'</option>';

Answer 1

也许您的第二个功能应该从#customer change开始

Answer 2

我看到您使用ajax中的联系人选择而不是您描述的客户。 但是，您编写的代码中，您使用了带有更改事件的联系人选择器，但是联系人选择框仅包含一个值，如何更改？

<select name="contact" id="contact">
    <option>-Select a Contact-</option>
</select>

先前的选择应该有多个选项可以更改。 或者我认为您是指#customer而是按以下方式联系：-

 $("#customer").change(function(){
                 //  your code;
            });

Answer 3

为什么不只使用ID和名称来编码 JSON响应？

foreach($db->query("SELECT * FROM contact WHERE cid = '$cid'") as $row) {
    $arr[] = array("id" => $row['id'], "name" => $row['name']);
}
echo json_encode($arr);

然后在您的ajax响应中，您可以

$(document).ready(function () {
    $("#customer").change(function () {
        var cid = $("#customer").val();
        $.ajax({
            type: "post",
            url: "contact.php",
            data: {cid: cid},
            success: function (data) {
                var options = [];
                $.each(data, function () {
                    options.push('<option value="' + this.id + '">' + this.name + '</option>');
                });
                $("#contact").html(options.join(""));
            }
        });
    });
});

用php mysql jquery ajax动态更新选择框

问题描述

3 个解决方案

解决方案1
1 2014-02-28 00:07:01

解决方案2
0 2014-02-28 00:10:24

解决方案3
0 2014-02-28 00:17:16

用php mysql jquery ajax动态更新选择框

问题描述

3 个解决方案

解决方案1 1 2014-02-28 00:07:01

解决方案2 0 2014-02-28 00:10:24

解决方案3 0 2014-02-28 00:17:16

解决方案1
1 2014-02-28 00:07:01

解决方案2
0 2014-02-28 00:10:24

解决方案3
0 2014-02-28 00:17:16