Question

简介：

我有2个下拉菜单。第二个下拉列表是根据第一个下拉列表（json_display.php）的值通过json（index.html）加载的。我使用了json - append()来加载内部下拉。

问题：

json追加（）总是以数组键的升序排列。预期的结果是以数组顺序json_display.php返回的格式显示。

我有警告jquery theResponse，显示错误的排序顺序。
我尝试使用数组键作为整数和字符串，在这两种情况下输出都相同。

注意：

（实际上我试图以日期降序检索mysqli行并在数组中存储id => name并返回）

为简单起见，我已将代码的问题部分提取到index.html和json_display.php，这是更大编码的一部分。还将mysql检索更改为数组。为了便于说明，更改了名称和所有值。

图形说明

的index.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test</title>
<script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>

<script type="text/javascript">
$(document).ready(function(){

    $("#frm").on('change', ' #first_select_box', function(){
        var $this    = $(this);
        var this_val = $this.val();

        $('#second_select_box option').not(':eq(0)').remove();

        $.ajax({
            type     : "POST",
            url      : "json_display.php",
            data     : { first_select_id: this_val },
            dataType : 'json',
            success  : function(theResponse) {

                //alert(JSON.stringify(theResponse));

                $.each(theResponse, function(key, value) {
                    $('#second_select_box')
                    .append($("<option></option>")
                    .attr("value",key)
                    .text(value));
                });
            }

        });

    });
}); 
</script>
</head>

<body>

<form id="frm" name="frm" method="post" action="#a">

<select id="first_select_box" name="first_select_box">
<option value="0">[First Drop Down]</option>
<option value="1">Numbers</option>
<option value="2">Fruits</option>
<option value="3">Teens</option>
</select>

<select id="second_select_box" name="second_select_box">
<option value="0">[Select]</option>
</select>

</form>

</body>
</html>

json_display.php

<?php
$Array[0] = array();
$Array[1] = array(10 => 'Ten', 
                  9  => 'Nine', 
                  8  => 'Eight', 
                  7  => 'Seven', 
                  6  => 'Six', 
                  5  => 'Five', 
                  4  => 'Four'
                  );

$Array[2] = array(8 => 'Apple', 
                  1 => 'Orange', 
                  3 => 'Banana', 
                  2 => 'Watermelon', 
                  7 => 'Lemon'
                  );

$Array[3] = array(17 => 'Seventeen', 
                  11 => 'Eleven', 
                  13 => 'Thirteen', 
                  15 => 'Fifteen', 
                  12 => 'Twelve', 
                  14 => 'Fourteen', 
                  16 => 'Sixteen'
                  );

$first_select_id      = isset($_POST['first_select_id']) ? $_POST['first_select_id'] : 0;

$return_array = $Array[$first_select_id];

echo json_encode($return_array);

?>

Answer 1

我有类似的问题。我的C＃应用程序允许用户覆盖表中值列表的默认排序顺序，因此传递回javascript的数据不一定按字母顺序或数字顺序排列。当它离开我的MVC控制器动作时，数据的顺序正确，但是当检查返回到浏览器的响应时，列表已经按数字键排序。

由于我需要我的选择列表选项按照我的用户指定的顺序，我尝试按照Thamilan的建议在我的键的开头添加一个空格，但不幸的是，这不起作用。只添加任何旧字符也行不通，因为它仍会根据字母数字排序规则对其进行排序，我不希望它在ALL处排序。

因此，我在循环中添加了一个计数器，该循环添加到返回到浏览器的列表中，并使用“。”预先计算了计数器的值。到我的密钥，因为它被添加到列表中，以便返回到浏览器时返回的列表如下所示：

这确保了字母数字排序总是按照我故意创建的顺序排列。所以我在javascript中所做的就是根据我的应用程序的需要提取出选项列表的正确键值。要做到这一点，我只需删除前缀计数器和“。”从我的密钥使用拆分：

var optionValue = xhrKey.split(".")[1];

结果选择列表的顺序与从我的控制器返回的顺序相同，并且选择列表中的选项分配了正确的值。

Answer 2

显示正确为Q. How can we convert object into byte array? Q. How can we serialize a object? Q. How can we De-serialize a object? Q. What is the need of serialization and de-serialization?发送至json_display.php。 index.html发送索引数组，因此显示正确。例如，查看您的第一个json_display.php

索引

$Array

这意味着$Array[1] = array(10 => 'Ten', 9 => 'Nine', 8 => 'Eight', 7 => 'Seven', 6 => 'Six', 5 => 'Five', 4 => 'Four' );的{{1}}索引将具有10th值，依此类推。因此，当它涉及JS时，它已经编入索引，并将$Array[1]作为第一个选项，Ten作为最后一个选项。您需要将数组键包装在引号中。因此，举个例子，您的数组应该像这样转换

Four

这应该可以解决您所拥有的订单问题。希望有所帮助。

更新

由于所有浏览器仍然索引数组数字键，因此只有选项IMO才能发送正确的索引数组。例如，php应该以下列格式发回数组

Ten

然后在index.html中，您需要将响应代码修改为。

$Array[1] = array('10' => 'Ten', 
                  '9'  => 'Nine', 
                  '8'  => 'Eight', 
                  '7'  => 'Seven', 
                  '6'  => 'Six', 
                  '5'  => 'Five', 
                  '4'  => 'Four'
                  );

这可能会有所帮助 How do you stop Chrome and Opera sorting JSON objects by Index ASC?

Answer 3

在将密钥发送到浏览器之前，使用空格附加密钥。这个json现在不会被分类。它是一种默认行为，无论您发送数据的顺序如何，都会对键进行排序。但如果通过在键之前附加空格将它们作为字符串给出，则它们不会被排序。

Answer 4

所需的结果可以通过以下代码获得，但我不确定是否有更好的方法。

<强> json_display.php

<?php
$Array[0] = array();
$Array[1] = array(10 => 'Ten', 
                  9  => 'Nine', 
                  8  => 'Eight', 
                  7  => 'Seven', 
                  6  => 'Six', 
                  5  => 'Five', 
                  4  => 'Four'
                  );

$Array[2] = array(8 => 'Apple', 
                  1 => 'Orange', 
                  3 => 'Banana', 
                  2 => 'Watermelon', 
                  7 => 'Lemon'
                  );

$Array[3] = array(17 => 'Seventeen', 
                  11 => 'Eleven', 
                  13 => 'Thirteen', 
                  15 => 'Fifteen', 
                  12 => 'Twelve', 
                  14 => 'Fourteen', 
                  16 => 'Sixteen'
                  );

$first_select_id      = isset($_POST['first_select_id']) ? $_POST['first_select_id'] : 0;

$return_array_temp = $Array[$first_select_id];
$return_array = array();
foreach ($return_array_temp as $key => $value) {
    $return_array[$key." "] = $value;
}
echo json_encode($return_array);

?>

<强>的index.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test</title>
<script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>

<script type="text/javascript">
$(document).ready(function(){

    $("#frm").on('change', ' #first_select_box', function(){
        var $this    = $(this);
        var this_val = $this.val();

        $('#second_select_box option').not(':eq(0)').remove();

        $.ajax({
            type     : "POST",
            url      : "json_display.php",
            data     : { first_select_id: this_val },
            dataType : 'json',
            success  : function(theResponse) {

                //alert(JSON.stringify(theResponse));

                $.each(theResponse, function(key, value) {
                    $('#second_select_box')
                    .append($("<option></option>")
                    .attr("value",key.trim())
                    .text(value));
                });
            }

        });

    });
}); 
</script>
</head>

<body>

<form id="frm" name="frm" method="post" action="#a">

<select id="first_select_box" name="first_select_box">
<option value="0">[First Drop Down]</option>
<option value="1">Numbers</option>
<option value="2">Fruits</option>
<option value="3">Teens</option>
</select>

<select id="second_select_box" name="second_select_box">
<option value="0">[Select]</option>
</select>

</form>

</body>
</html>

Answer 5

使用 array_flip（）函数在数组

中交换键值

变化

a.b

到

echo json_encode($return_array);

你会得到预期的结果。

php json - 以返回的数组顺序显示问题（json sort）

5 个答案: