JSON_encode PHP数组准备好jQuery自动完成

时间:2013-10-02 10:24:56

标签: php jquery json

我正在尝试将PHP数组传递给我的视图,然后使用该数组来填充jQuery自动完成。

foreach ($products as $product)
{               
    $productsArray[] = array('label' => $product->getName()  ,'id' => $product->getId() , 'value' => $product->getUrlSafeName());                           
}

$productsJson = json_encode($productsArray);

$productsJson然后传递给视图,我将其插入到DOM中。我正在使用Twig作为我的模板引擎:

<div id="autocompleteData">{{ productsJson }}</div>

然后是我的jQuery:

$( document ).ready(function() {

    var autocompleteData = $('#autocompleteData').text();       

    $('#findoffice_location').autocomplete({ 
         source: autocompleteData,
         change: function (event, ui) {  } });

});

如果我是console.log autocompleteData,它看起来像结构中的JSON对象,但不是。

如果我这样做:

var autocompleteData = [{"label":"Toybox","id":1,"value":"toybox"},{"label":"Shoe","id":2,"value":"shoe"},{"label":"Eggs","id":3,"value":"eggs"}];

然后是consolelog,每个autocompleteData产品都是一个合适的JSON对象,自动完成功能按预期工作。

2 个答案:

答案 0 :(得分:1)

您需要将.text()的字符串输出转换为JSON:

source: jQuery.parseJSON(autocompleteData)

当您手动输入时,您将使用实际的JSON,因此它可以正常运行。

答案 1 :(得分:0)

尝试将autocompleteData包装在$ .parseJON的调用中,如下所示:

$( document ).ready(function() {

    var autocompleteData = $('#autocompleteData').text();       

    $('#findoffice_location').autocomplete({ 
        source: $.parseJON(autocompleteData),
        change: function (event, ui) {  } });

});

编辑@George打败了我。