Question

我使用bootstrap和CI。我创建了一个包含2下拉列表的表单，用于从MySQL中检索数据。

我有tb_sekolah表格，id，kota，nama，provinsi和status_sekolah作为列名。

我确实在第一个下拉列表中的kota表格中显示了来自tb_sekolah的数据。问题是，我想在第二个下拉列表中显示来自nama的数据。如果用户在第一个下拉列表中选择数据，则第二个下拉列表会显示nama的数据。

示例：列kota包含yogyakarta，bantul和sleman等数据。列nama包含sma 1 yogyakarta，sma 3 yogyakarta，sma 1 sewon，sma 1 sleman等数据。如果用户在第一个下拉列表中选择yogyakarta，则第二个下拉列表仅显示sma 1 yogyakarta和sma 3 yogyakarta

Answer 1

首先，您必须禁用第二个下拉列表，然后必须编写一个jquery / javascript函数，该函数会在更改事件时调用，即，当第一个下拉列表中的某些内容被选中时。

$('#select').on('change',function(){

    var value = $(this).text();
    $.ajax({
        url: "url goes here",
        data: value
    }).done(function(data) {
        $('#secondDropdown').removeClass('disabled');
        $('#firstDropdown').html(data);
    });

});

url必须指向一个控制器函数，该函数将以html格式查询和发送相关的下拉选项。

foreach ($options as $option) {
        $string = $string.
        "<option value=$option->name>$option->name</option>"; 
}

Answer 2

这是我遇到很多框架的一个常见问题，最容易和最简单的方法就是创建一个包含HTML的列表的字符串，这个列表由sql填充，这个我的个人脚本在这里我用过LARAVEL随意使用它。

$string = "<option value=></option>";
foreach ($categories as $category_item)
{
        $string = $string.
        "<option value=$category_item->name>$category_item->name</option>";
}

Answer 3

试试这个：

1）首先，在从第一个下拉列表中选择值后，您必须执行ajax调用。我会使用jQuery但你可以随意使用它。

$.ajax({
    url : 'path/to/url/get_nama',
    dataType : 'json',
    method : 'get',
    data : {
        kota : $("#first_dropdown").val()
    },
    success : function(data){
        //add data to second column here
        $("#second_dropdown").empty();
        for(d in data['nama']){
            $("#second_dropdown").append("<option value='" + data['nama'][d].id + "'>" + data['nama'][d].nama + "</option>");
        }
    },
    error : function(){}
});

在你的php模型代码中：

function get_nama()
{
    $kota = $this->input->get('kota');

    $query = $this->db->query("SELECT id, nama FROM tb_sekolah WHERE kota = '{$kota}'");

    $data = array(
        'nama' => $query->result_array(),
        'success' => TRUE
    );

    print json_encode($data);

}

使用下拉选项自动填充PHP表单中的选择字段

3 个答案: