1

我在该表中有一个表有 3 个字段(类别 1,类别 2,类别 3)。现在我想填充下拉列表,如果下拉一个选择,下拉 2 值将从数据库中生成。谁能帮我。

我的控制器

            $this->load->model('quiz_mode');
            $arrStates = $this->quiz_mode->get_unique_catg1();

            foreach ($arrStates as $states)
            {
                $arrFinal[$category->category1 ] = $category->category1 ;
            }
            $data['category2'] = $arrFinal;
      function ajax_call() 
    {

        //Checking so that people cannot go to the page directly.
        if (isset($_POST) && isset($_POST['category1']))
        {

            $catogory = $_POST['category1'];
            $arrcategory = $this->sampl_mode->get_cities_from_catgo1($catogory);

            foreach ($arrcategory as $category)
            {
               $arrFinal[$category->category2] = $category->category2;
            }

            //Using the form_dropdown helper function to get the new dropdown.
            print form_dropdown('category2',$arrFinal);
        }
        else
        {
            redirect('logged_in_user'); //Else redire to the site home page.
        }
    }

我的模特

function get_unique_catg1()
{

    $query = $this->db->query("SELECT DISTINCT category1  FROM sampl_table");

    if ($query->num_rows > 0) {
        return $query->result();
    }
}
    function get_cities_from_catgo1($category) {
    $query = $this->db->query("SELECT category2  FROM sampl_table WHERE category2 = '{$category}'");

    if ($query->num_rows > 0) {
        return $query->result();
    }
}

我的观点

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
    <title>untitled</title>

        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function () {

                $('#catgo1-dropdown').change(function () {
                    var selCat1 = $('#catgo1-dropdown').val();
                    console.log(selCat1);
                    $.ajax({
                        url: "<?php echo base_url();?>index.php/sample/ajax_call", //The url where the server req would we made.
                        async: false,
                        type: "POST", //The type which you want to use: GET/POST
                        data: "category1="+selCat1, //The variables which are going.
                        dataType: "html", //Return data type (what we expect).

                        //This is the function which will be called if ajax call is successful.
                        success: function(data) {
                            //data is the html of the page where the request is made.
                            $('#cotegory').html(data);
                        }
                    })
                });
            });
        </script>
</head>

    <body>
    <div id="wrapper">
                <div id="catgo1-dropdown"><?php print form_dropdown('category1'); ?></div>
                <div id="cotegory2"></div>

            </div>
    </body>

</html>
4

2 回答 2

2

有一个非常简单的解决方案

首先只显示第一个下拉列表
,然后当用户选择某个值时,通过 ajax 将其发送到控制器方法,该值将被接收并传递给模型。
在模型中应该有条件查询它将获取结果
然后返回控制器调用视图并将查询结果传递给它
您的视图应该包含此代码

<?php
foreach($queryresult as $row)
{
?>
<option value = "<?php echo $row->id?>"><?php echo $row->value;?</option>
<?php
}
?>

在您第一次查看有下拉列表的位置时,它应该包含以下代码

<select name = "first_drop_down" id = "first_drop_down" onchange = "calljavascriptfunction();">
<?php foreach($first_drop_down_values as $row){?>
<option value = "<?php echo $row->id?>"><?php echo $row->value;?</option>
<?php}?>

 <select name = "second_drop_down" id = "second_drop_down" >
 <option value = "0">please select first dropdown</option>
 </select>

和ajax功能

function calljavascriptfunction(){


  $.ajax({
     type : 'POST',
     data : 'first_drop_down_id='+ $('#first_drop_down').val(),
     url : 'controller/method',
     success : function(data){
                 $('#second_drop_down').val(data);
     }
 });
}

完成了,这也是一个教程

http://mikeheavers.com/index.php/site/code_single/dynamic_dependent_dropdown_filtering_with_codeigniter_and_jquery

于 2012-07-03T07:20:40.630 回答
0

.html(msg);在下拉菜单的 div 容器上使用

  <script type="text/javascript">
    $(document).ready(function() {  
    $('[name="wilaya"]').change(function () {  
            var input= this.value;
            //alert(input);
            $.ajax({
            url: "<?php echo base_url();?>/register/ajax_call",
            data: "input="+input
            })
            .done(function( msg ) {
            $(".commune").html(msg);
            }); }); 
      }); 
    </script>

和控制器 Register.php 方法ajax_call()

public function ajax_call(){

if (isset($_REQUEST['input']))
        {
        //  echo("hello");
        $input = $_REQUEST['input'];
        $this->load->model('Pro_model');
        $commune=$this->Pro_model->get_dropdown_commune($input);
        //print_r($commune);
        //$this->load->view('registerpro_view', $commune); 
       echo form_dropdown('commune', $commune, 'Adrar');
        }


}

并在模型端 Pro_model.php

function get_dropdown_commune($input)
{
$this->db->from('ea_commune');
$this->db->where('id_wilaya', $input);
$this->db->order_by('id');
$result = $this->db->get();
$return = array();
if($result->num_rows() > 0) {

foreach($result->result_array() as $row) {
$return[$row['id']] = $row['label_commune'];
}
}

        return $return;

}
于 2016-02-22T13:58:04.310 回答