从PHP代码返回的JSON字符串填充下拉列表


Populating dropdown from JSON string that was returned from a PHP CODE

我从PHP类返回一个JSON数组。部分代码如下:

...
echo json_encode($users);
return json_encode($users);
?>

上述代码的echo语句如下:

[
    {
        "ID": "1",
        "firstname": "Jane",
        "school": "Frohj"
    },
    {
        "ID": "2",
        "firstname": "Mathew",
        "school": "Lebrasky"
    },
    {
        "ID": "3",
        "firstname": "BAHUUU",
        "school": "uni of kansas"
    }
]

现在,在我的html表单中,我有一个DROPDOWN。

     <fieldset>
          <legend>Selecting elements</legend>
          <p>
             <label>Select list</label>
             <select id = "myList">
               <option value = "1">I WANT TO DISPLAY USER'S NAME HERE</option>
               <option value = "2">I WANT TO DISPLAY USER'S NAME HERE</option>
             </select>
          </p>
       </fieldset>

我想将用户firstname显示为dropdown box中的字段。其值是从传递的JSON中获得的。现在我该如何检索JSON并用用户的firstnames填充下拉框。

您可以通过json_decode($users)解码为json结果;这个函数将json结果it转换为数组。

借助loop,您可以轻松打印选项。

认为您的选择在开始时应该为空,然后新选项应该附加javascript。

<select id = "myList"></select>
<script type="text/javascript">
var data = SOME_SORTOF_GET_JSON(), // get json from your existing function
    select = document.getElementById("myList"),
    newOption;
for(var i = 0, item; item = data[i]; ++i) {
    newOption = new Option(item.firstname, item.id);
    select.add(newOption);
}
</script>

祝你好运。

类似这样的东西:

html页面的头部(带有php扩展)

<?php include 'pathTo/find.php' ?>

在您的脚本标签中:

var
  i, len,
  html = ''
  list = <?php echo getUsers(); ?>;
for ( i = 0; len = list.length; i < len ) {
    html += '<option value="'+ i +'">'+ list[i].firstname +'</option>';
}
// $( html ).appendTo( $( '#myList' ) ); <-- jQuery method
document.getElementById( 'myList' ).innerHtml = html;

你的身体标签:

<fieldset>
    <legend>Selecting elements</legend>
    <p>
    <label>Select list</label>
    <select id = "myList">
    </select>
    </p>
</fieldset>
相关文章: