0

然后我有一个从db恢复并变成json的省份列表。 All'autocomplete 我提供这个文件province.php，它返回所有省份的列表。该文件使用简单查询 SELECT * FROM 省份显示所有省份。

我被迫选择这条路径，以便把这个缓存的结果和避免没有数据库查询只对省的选择。

真正的问题是什么？

该自动完成以他自己的方式工作，或者确实看到从文件中提取的所有省份的列表province.php，但它无法过滤结果。

因此，如果我写 MILA ... 应该只显示与 MILA .. 接壤的省份，因为总是给我整个列表？

<script>
  $(function() {
    $( "#province" ).autocomplete({
      source: 'province.php'
    });
  });
</script>

文件 Province.php 返回如下内容：

{"0":{"id":"1","label":"米兰","value":"米兰"},"1":{"id":"2","label":"卡利亚里","value":"卡利亚里"},"2":{"id":"3","label":"Messina","value":"Messina"},"5":{"id": "4","label":"Roma","value":"Roma"},"6":{"id":"5","label":"Venezia",​​"value":"Venezia"} }

好像我这样做是可行的：

<script>
  $(function() {
    var province = [
      { label: "milano", value: "milano", id: 1 },
      { label: "Cagliari", value: "Cagliari", id: 2 },
      { label: "Messina", value: "Messina", id: 3 },
      { label: "Roma", value: "Roma", id: 4 },
      { label: "Catania", value: "Catania", id: 5 },
      { label: "Venezia", value: "Venezia", id: 6 }
    ];
    $( "#tags" ).autocomplete({
      source: province
    });
  });
  </script>

为什么？

4

2 回答 2

1

您可以尝试使用for..in将您的对象解析为[]您需要的对象，如下所示：

// The following object masquerades as an array.
var fakeArray = {
    "0": {
        "id": "1",
            "label": "Milano",
            "value": "Milano"
    },
        "1": {
        "id": "2",
            "label": "Cagliari",
            "value": "Cagliari"
    },
        "2": {
        "id": "3",
            "label": "Messina",
            "value": "Messina"
    },
        "5": {
        "id": "4",
            "label": "Roma",
            "value": "Roma"
    },
        "6": {
        "id": "5",
            "label": "Venezia",
            "value": "Venezia"
    }
}

var realArray = [];

for (var i in fakeArray) {
    realArray.push(fakeArray[i]);
}

现在realArray将以您需要的形式包含数据：

[
    {
        "id": "1",
        "label": "Milano",
        "value": "Milano"
    },
    {
        "id": "2",
        "label": "Cagliari",
        "value": "Cagliari"
    },
    {
        "id": "3",
        "label": "Messina",
        "value": "Messina"
    },
    {
        "id": "4",
        "label": "Roma",
        "value": "Roma"
    },
    {
        "id": "5",
        "label": "Venezia",
        "value": "Venezia"
    }
]

现在，你需要做的就是，

$("#test").autocomplete({
    source: realArray
})

假设#test是您的文本框的 id。

演示：http: //jsfiddle.net/hungerpain/rNzpg/1/

编辑： 如果您的数据来自php文件，getJSON请先使用获取数据：

$.getJSON('province.php').done(function(result) {
   fakeArray = result ; 

   var realArray = [];

   for (var i in fakeArray) {
        realArray.push(fakeArray[i]);
   }

    $("#test").autocomplete({
      source: realArray
    });  

});

PHP：为了让你的代码本身循环，你的 PHP 代码必须构造一个像这样的数组：

 var $array = array();
 foreach ($province as $provincia) { 
   array_push($array, $province);
 } 

 echo json_encode($array)

一定要有这个： header('Content-type: application/json');

然后你的 JS 看起来很简单：

 $( "#tags" ).autocomplete({
      source: "province.php"
 });

希望这可以帮助！

于 2013-07-26T08:19:43.270 回答
0

尝试

$(function() {
    $("#province").autocomplete({
        source : function(request, response) {
            $.getJSON('province.php').done(function(result) {
                var regex = new RegExp(request.term, 'i');

                var array = $.map(result, function(item, idx) {
                    if(!regex.test(item.label)){
                        return;
                    }

                    return {
                        label : item.label,
                        value : item.value,
                        id : item.id
                    }
                });
                response(array)
            });
        }
    });
});
于 2013-07-26T08:10:14.757 回答