使用来自 PHP 的 JSON 数据填充 jQuery Select2() 控件

Question

同样的事情我已经做了好几次（实际上也是在同一个项目上）并且效果很好。我对同一代码的这个实例有疑问。首先，我 select 来自数据库的一些数据 table:

$azioni = $pdo->query("SELECT id_az, concat_ws('-',Descrizione, RGE) as descrizione 
                       FROM azioni_head 
                          JOIN sofferenze ON sofferenze.id_soff = azioni_head.id_soff
                        ORDER BY Descrizione")
               ->fetchAll(PDO::FETCH_ASSOC);

这给了我一个这样的数组（只是前几项）：

Array
(
    [0] => Array
        (
            [id_az] => AZ000000126
            [descrizione] => Acciaierie Weissenfels S.p.A.-n/d
        )

    [1] => Array
        (
            [id_az] => AZ000000017
            [descrizione] => Acofer S.p.A.-n/d
        )
)

然后我将此数组转换为 Json 数组，执行以下操作： var azioni = <?php echo json_encode($azioni); ?>; 最后，我使用这些数据填充了一个 Select2，但这次 select2 中没有任何项目。如果我在使用 alert(azioni.join( )); 编码后尝试查看数组，我会得到：

[object Object],[object Object],[object Object],[object Object],

最后我运行:

$('#cod_az').select2({ placeholder: "Scegli", data: azioni });

怎么了？为什么我不能使用这个数组来用数据填充 Select2？它适用于我应用程序的其他部分！

编辑这是 console.log(azioni) 在 firebug 中的结果：

[
Object { id_az="AZ000000126",  descrizione="Acciaierie Weissenfels S.p.A.-n/d"}, 
Object { id_az="AZ000000017",  descrizione="Acofer S.p.A.-n/d"}, 
Object { id_az="AZ000000039",  descrizione="ADANI SAS DI ADANI PAOLO & C. S.p.A.-n/d"}, 
Object { id_az="AZ000000019",  descrizione="Administration Speciale ...NG S.A. en faillite-n/d"}
]

Answer 1

这是标准和期望的行为。您想要的是检查对象的内容，而不是获取 [object Object] 字符串，这是 toString() 方法的正确结果。

有几种方法可以检查 Javascript 中的数组和对象的结构。我所做的非常简单并且效果很好，但它有轻微的扭曲。

var data = JSON.parse(input);
// data now contains the JSON data
// to print it on-screen I do:
alert(JSON.stringify(data));

将数据重新编码为 JSON 听起来可能很奇怪，但您已经完成了完整的上交：

正在解析JSON
渲染JSON

所以您真的可以确信 input 字符串是有效的 JSON 并且您在 alert() 中看到的是实际内容。我不知道还有比这更简单的方法了。

编辑： 请注意，这与直接打印 input 字符串不同。 decode/recode 转身确实为您做了很多：它表明它可以解码 JSON 并向您展示解码后的实际情况。例如，不保留属性的顺序。

Answer 2

要调试，请使用 console.dir(azioni); 检查您的对象。

将您的 id_az 和 descrizione 键更改为 id 和 text

var data = [{ id: 0, text: 'item1' }, { id: 1, text: 'item2' }];

$(".js-example-data-array").select2({
  data: data
})

https://select2.github.io/examples.html

默认情况下 jquery select2 期望数据采用 id/text 格式。

使用来自 PHP 的 JSON 数据填充 jQuery Select2() 控件

populating a jQuery Select2() control with JSON data from PHP

javascript

php

arrays

jquery-select2