JSON 编码 PHP 数组已准备好用于 jQuery 自动完成 - JSON encode PHP array ready for jQuery Autocomplete

JSON encode PHP array ready for jQuery Autocomplete

我正在尝试将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) {  } });
});

如果我控制台.log自动完成数据，它在结构上"看起来"像 JSON 对象，但事实并非如此。

如果我这样做：

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

然后是控制台日志，每个自动完成数据产品都是正确的 JSON 对象，并且自动完成按预期工作。

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

source: jQuery.parseJSON(autocompleteData)

当您手动输入它时，您正在输入实际的 JSON，因此它为什么有效。

尝试像

这样将autocompleteData包装在对 $.parseJON 的调用中：

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

编辑@George打败我。