如何使用 json 函数用数据库填充组合框?

Posted

技术标签:

【中文标题】如何使用 json 函数用数据库填充组合框?【英文标题】:how to use a json function for filling combo box with database? 【发布时间】:2013-05-03 05:46:45 【问题描述】:

我是 html 新手,正在尝试数据库之间的关系。我想用数据库填充框

我有一个类似的代码

<div class="content" data-role="content" id="content" >
         <div id="car">
            <select name="selectCar" class="span12" id="Options" >
            <option value="-1">Bir istasyon seçiniz.</option>
            <option value="1">Mimarlık</option>
            <option value="2">Yurtlar</option>
            <option value="3">Bilgisayar Mühendisliği</option>
            <option value="4">Kimya Mühendisliği</option>
            <option value="5">Rektörlük</option>
            </select>           
         </div>
         <div id="cinfo"></div>

        <button onclick="javascript:callCarInfo.call(this,document.getElementById('Options').value);">Call Podcar</button>

      </div>

这里

            <option value="1">Mimarlık</option>
            <option value="2">Yurtlar</option>
            <option value="3">Bilgisayar Mühendisliği</option>
            <option value="4">Kimya Mühendisliği</option>
            <option value="5">Rektörlük</option>

我想用数据库填充这些值和站点名称

我还有一个站功能是

function getStationList()

    $db = new DBManager();
    $mysqli = $db->db_connect();

    $query = "SELECT stationId FROM Station";

    $stmt = $mysqli->prepare($query);
    $stmt->execute();
    $result = $stmt->get_result();

    $list = array();

    while($row = $result->fetch_assoc())
    
        $list[] = $row['stationId'];
    

    return json_encode($list);

我尝试使用 ajax 功能,但我做不到,这是

$.ajax(
    url:'Stations.php',
    type:'POST',
    data: 'q=' + str,
    dataType: 'json',
    success: function( json ) 
        $.each(json, function(i, value) 
            $('#myselect').append($('<option>').text(value).attr('value', value));
        );
    
);

【问题讨论】:

.append($(' ')。根据你的代码,如果你想填写名为“selectCar”,那么它应该是:$('#Options').append($('')。休息似乎没问题。 但是我应该在哪里调用函数来填充这个?我的意思是在哪里以及如何调用 getStationList() .. 对不起,我的意思是我应该在哪里以及如何调用具有 $.ajax( url: .... 的函数 getStation() 好的,我发布了一个示例,希望对您有所帮助 【参考方案1】:

JS(page.html):

$(document).ready(function() 
  $.ajax(
    url:'Stations.php',
    type:'POST',
    data: 'q=' + str, // not sure you need that as you are not filtering on server side
    dataType: 'json',
    success: function( json ) 
        $.each(json, function(i, value) 
            $('#myselect')
                  .append($('<option></option>', text:value)
                  .attr('value', text);
        );
    
  );
)

HTML(page.html):

<div class="content" data-role="content" id="content" >
         <div id="car">
            <select name="selectCar" class="span12" id="Options" ></select>           
         </div>
         <div id="cinfo"></div>
        <button onclick="javascript:callCarInfo.call(this,document.getElementById('Options').value);">Call Podcar</button>
</div>

Stations.php:

<?php
getStationList();
?>

快速解释:当 page.html 被加载并准备好时,它对 Stations.php 进行 ajax 调用以获取 Stations 列表。在响应时,它会迭代结果并将每个结果的选项元素添加到 ID 为“选项”的选择元素中。

【讨论】:

感谢您的回答,我认为它正在工作,但这次我遇到了数据库问题 :)

以上是关于如何使用 json 函数用数据库填充组合框?的主要内容,如果未能解决你的问题,请参考以下文章

如何根据用户类型用相似的记录重新填充组合框

使用本地 JSON 数据填充 ExtJS 3.4 组合框

如何使用 JSON 数据数组加载 extjs 3.4 存储

如何更改代码以使组合框显示 displayField 值列表

使用组合框从数据库中选择表并填充 datagridview - 无法使其工作

如何根据 sencha 中 json 响应的第一个组合值填充第二个组合