如何使用Select2 jquery插件获取AJAX结果的结果值?

时间:2015-04-13 06:51:17

标签: jquery ajax

你能帮我解决这个问题吗? 我正在我的表单中构建一个自动完成ajax下拉列表,我在获取插件的结果时遇到了问题。我有我的ajax结果但我的问题是我无法在下拉列表中显示结果。

这是我的一些代码:

<select class="form-control" id="product-selector" style="width:100%"></select>

...

<script type="text/javascript">
    $("#product-selector").select2({
        placeholder: "Please select product",
        ajax: {
            url: "index.php?route=catalog/product/getProductBySelection&token=<?php echo $token; ?>",
            dataType: "json",
            data: function(params) {
               return {
                   q: params.term, // search term
                   page: params.page,
                   seller_id: <?php echo $seller_id; ?>
               };
            },
            processResults: function(data, page) {
                var results = [];

                $.each(data, function(index, item) {
                    results.push({
                        product_id: item.product_id,
                        name: item.name
                    });
                });

                return {
                    results: results
                };

                //console.log(results)

            },
            cache: true
        },
        escapeMarkup: function (markup) { return markup; }, // let our custom formatter work
        minimumInputLength: 1
    });
</script>

我在网络标签中的输出是这样的:

[{"product_id":"45","name":"MacBook Pro"},{"product_id":"52","name":"sample3"},{"product_id":"56","name":"sample71"},{"product_id":"72","name":"Sample 45"}]

我希望你能帮助我。感谢

1 个答案:

答案 0 :(得分:2)

您需要将参数传递为&#39; id&#39;和&#39;文字&#39;而不是product_id和名称。

<script type="text/javascript">
$("#product-selector").select2({
    placeholder: "Please select product",
    ajax: {
        url: "index.php?route=catalog/product/getProductBySelection&token=<?php echo $token; ?>",
        dataType: "json",
        data: function(params) {
           return {
               q: params.term, // search term
               page: params.page,
               seller_id: <?php echo $seller_id; ?>
           };
        },
        processResults: function(data, page) {
            var results = [];

            $.each(data, function(index, item) {
                results.push({
                    id: item.product_id,
                    text: item.name
                });
            });

            return {
                results: results
            };

            //console.log(results)

        },
        cache: true
    },
    escapeMarkup: function (markup) { return markup; }, // let our custom formatter work
    minimumInputLength: 1
});
</script>

阅读select2 4.0.0

的此文档