從Multi Select Codeigniter中依賴下拉菜單

Question

我有客戶文本字段，其中包含客戶名稱。 然后，我還有Project Textfield，其中包含來自客戶的項目名稱。 我想從多選客戶中進行依賴下拉菜單。 例如，用戶從“客戶文本”字段中選擇：btel，celc，它僅出現在btel和celc的“項目文本”字段中。 這是我的JS：

<script type="text/javascript">
  $('.filter_user_customer').select2();
        $(document).ready(function(){
        $('input[name="daterange"]').daterangepicker({
            opens: 'left',
            drops: 'up'
          }, function(start, end, label) {
              console.log("A new date selection was made: " + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD'));
          }); 
        // key category select box
        var $category     = $('select#categoryField');
        // customer select box
        var $customer   = $('select#customerField');
        // project select box
        var $projects   = $('select#projectField');
        // on change user role, get projects
        var $role       = $('select#roleField');
        // on change user id, get projects
        var $userid     = $('select#useridField');
        // on change combiner
        var $combiner   = $('combinerField');

        $customer.on('change', function () {
            // get selected customer name
            var customer = $(this).find('option:selected').val();
            console.log(customer);
            // post data with CSRF token
            var data = {
                action:'project',
                customer: customer,
                "<?=$this->security->get_csrf_token_name()?>" : "<?=$this->security->get_csrf_hash()?>"
            };
            // AjaxPOST to get projects
            $.post('<?php echo base_url(); ?>Dashboard/perfomance_monitoring', data, function(json) {
                projects_data = '<option value="0">All</option>';
                $.each(json, function(index, obj){
                    projects_data += '<option value="'+obj.project_id+'">'+obj.project_id+'</option>';
                });
                // append all projects in project dropdown
                $projects.html(projects_data);
            }, 'JSON');
        });

        // on change user role, get project
        $projects.on('change', function () {
            // get selected project name
            var project = $(this).find('option:selected').val();
            // AjaxPOSt wit CSRF
            var data = {
                action:'role',
                project: project,
                "<?=$this->security->get_csrf_token_name()?>" : "<?=$this->security->get_csrf_hash()?>"
            };
            $.post('<?php echo base_url(); ?>Dashboard/perfomance_monitoring', data, function(json) {
                role_data = '<option value="0">All</option>';
                $.each(json, function(index, obj){
                    role_data += '<option value="'+obj.user_owner+'">'+obj.user_owner+'</option>';
                });
                // append all role data in Role dropdown
                $role.html(role_data);
            }, 'JSON');
        });

        // on change user ID, get project
        $projects.on('change', function () {
            // get selected project name
            var project = $(this).find('option:selected').val();
            // AjaxPOSt wit CSRF
            var data = {
                action:'userid',
                project: project,
                "<?=$this->security->get_csrf_token_name()?>" : "<?=$this->security->get_csrf_hash()?>"
            };
            $.post('<?php echo base_url(); ?>Dashboard/perfomance_monitoring', data, function(json) {
                userid_data = '<option value="0">All</option>';
                $.each(json, function(index, obj){
                    userid_data += '<option value="'+obj.user_id+'">'+obj.user_id+'</option>';
                });
                // append all role data in Role dropdown
                $userid.html(userid_data);
            }, 'JSON');
        });
    });

</script>

這是我的控制器：

$array_data = array();
        // only on Ajax Request
        if ($this->input->is_ajax_request()) {
            // if request for projects
            if ($this->input->post('action') && $this->input->post('action') == 'project') {
                // get customer name
                $customer     = $this->input->post('customer', true);
                // get project data by customer name
                $array_data = $this->ixt_models->fetch_project(trim($customer), 'project');
                // AjaxPOST JSON response
                echo json_encode($array_data);die();
            }

這是我的模型：

public function fetch_project($where_data = null, $type = null)
{
     $query = '';

    // customer only
    if (is_null($type) && is_null($where_data)) {
        // desire column from table
        $this->db->select('cust_id');
        // only unique customer
        $this->db->distinct('cust_id');
        // mysql table
        $query = $this->db->get($this->table_helper);
    }

    // projects by customer
    elseif ($type == 'project' && !is_null($where_data)) {
        // desire column from table
        $this->db->select('project_id');
        // where clause
        $this->db->where('cust_id', $where_data);
        // mysql table
        $query = $this->db->get($this->table_helper);
    }

現在，僅當客戶選擇多個選項時，“項目文本字段”才顯示一個選項： 單擊此處

Answer 1

您可以嘗試此代碼。

JavaScript代碼：

function onchangeFunctionName(id) {
    if (id == '') {
        $('#SelectedId').prop('disable', true);
    } else {
        $('#SelectedId').prop('disable', false);
        $.ajax({
            url: base_url + '/Url here get value by selected value',
            type: "GET",
            data: {'id': id},
            dataType: 'json',
            async: false,
            success: function(data) {
                $.each(data, function(key, value) {
                    $('#IdNameWhereShowValue').append('<option ' ' value="' + value.valueId + '">' + value.ValueName + '</option>');
                });
            },
            error: function() {
            }
        });
    }
}

控制器代碼：

$array_data = $this->ModelName->MethodName(PassIdhere passed by the js code);

echo json_encode(array_data);