将 ajax 请求的 JSON 结果存储到 Easyautocomplete 的 javascript 变量

Question

我正在尝试使用 ajax 请求在一个字段上基于另一个字段中填写的值实施 EasyAutoComplete 插件。

我有一个 customerid 字段，当它的值发生变化时，我希望 productname 字段使用 EasyAutoComplete 插件显示与该 customerid 相关的所有产品。

这是我目前的情况：

$('#customerid').on('change',function() {
    var products2 = {
          url: function(phrase) {
            return "database/FetchCustomerProducts.php";
        },  
        ajaxSettings: {
            dataType: "json",
            method: "POST",
            data: {
                dataType: "json"
            }
        },
        preparePostData: function(data) {
            data.phrase = $("#customerid").val();
            return data;
          },
        getValue: "name",
        list: {
            onSelectItemEvent: function() {
                var value = $("#productname").getSelectedItemData().id;
                $("#productid").val(value).trigger("change");
            },
            match: {
              enabled: true
            }
        }
    };

$("#productname").easyAutocomplete(products2);
});

FetchCustomerProducts.php 的内容：

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

    $products = $app['database']->Select('products', 'customerid', $_POST['customerid']);

    echo json_encode(['data' => $products]);

}

但是它不起作用。该代码基于 this 页面上的 'Ajax POST' 示例。

Answer 1

您可以使用元素 select 类别添加是 class "check_catogory" 使用事件点击元素 select get value is option 后，继续将 id 发送到 ajax 并在文件 php 中，您可以获取 $_POST['id'] 或 $_GET['id'], select 查找数据库,回显后 json_encode

$("#customerid").change(function(){
    var id = $(this).val();
    if(id!=""){
        $.ajax({
            url:"database/FetchCustomerProducts.php",
            type:"POST",
            data:{id:id},
            dataType: "json",
            cache:false,
            success:function(result){
                 var options = {
                    data:result,
                    getValue: "name",
                    list: {

                        onSelectItemEvent: function() {
                            var value = $("#productname").getSelectedItemData().id;
                            $("#productid").val(value).trigger("change");
                        },

                        match: {

                          enabled: true

                        }

                    }
                };
                $("#productname").easyAutocomplete(options);

            }
        })
    }
});

将 ajax 请求的 JSON 结果存储到 Easyautocomplete 的 javascript 变量

Storing JSON result from ajax request to a javascript variable for Easyautocomplete

javascript

php

ajax

json

easyautocomplete