取决于多选代码点火器的下拉菜单

Question

我有一个客户文本字段，其中包含客户名称。然后，我也有项目文本字段包含来自客户的项目名称。我想从多选客户中进行依赖下拉。例如，用户从Customer Text字段中选择：btel，celc，它只显示在btel和celc的Project Text字段中。这是我的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);