php - 进行另一个选择时如何清除所选文本?
问题描述
我想在进行另一次选择后删除第一个选定的文本
J查询功能
<script type='text/javascript'>
$(document).ready(function(){
$('#department').change(function(){
var department = $(this).val();
// console.log(department);
$.ajax({
url: "<?php echo base_url();?>admin/payroll/fetch_employee",
method: "POST",
data: {department_id: department},
success: function(data)
{
$('#employee').html(data);
}
});
});
});
</script>
这就是我为选择框编写的方式
<div class="form-group" id="border-none">
<label for="field-1" class="col-sm-3 control-label"><?= lang('department') ?>
<span class="required">*</span>
</label>
<div class="col-sm-5">
<select name="department" class="form-control select_box" style="width: 100%" id="department">
<option value=""><?= lang('select') . ' ' . lang('department') ?></option>
<?php foreach ($all_department as $row){?>
<option <?php if(!empty($allowance_info)){
foreach($all_users as $user){
if($row->departments_id==$user->departments_id){ echo 'selected="selected"'; }}
}?>value="<?= $row->departments_id?>" ><?= $row->deptname?></option>
<?php } ?>
</select>
</div>
</div>
<div class="form-group" id="border-none">
<label for="field-1" class="col-sm-3 control-label"><?= lang('employee') ?>
<span class="required">*</span>
</label>
<div class="col-sm-5">
<select name="employee_id" class="form-control select_box" style="width: 100%" id="employee">
<option value=""><?= lang('select') . ' ' . lang('employee') ?></option>
<?php if(!empty($allowance_info)){ ?>
<?php foreach ($account as $row){?>
<option <?php if( $row->employment_id == $allowance_info->employee_id ){ echo 'selected="selected"'; } ?>
value="<?= $row->employment_id?>" ><?= $row->fullname ?>
</option>
<?php }} ?>
</select>
</div>
</div>
这是我在控制器中用于获取员工的代码
public function fetch_employee()
{
if($this->input->post('department_id'))
{
echo $this->payroll_model->fetch_employee($this->input->post('department_id'));
}
}
这是我在模型中检索员工数据的代码
function fetch_employee($department)
{
// $this->db->where('departments_id', $department);
// $this->db->order_by('username', 'ASC');
// $query = $this->db->get('tbl_users');
$this->db->select('tbl_account_details.*', FALSE);
$this->db->select('tbl_users.*',FALSE);
$this->db->from('tbl_account_details');
$this->db->join('tbl_users','tbl_users.user_id=tbl_account_details.user_id','left');
$this->db->where('tbl_users.departments_id', $department);
$query = $this->db->get();
$output = '<option value="">Select Employee</option>';
foreach($query->result() as $row)
{
$output .= '<option value="'.$row->employment_id.'">'.$row->fullname.'</option>';
}
return $output;
}
解决方案
假设一个<select>
标签有 iddepartment
而另一个<select>
有employee
在更改部门下拉列表时,员工下拉列表正在重置
<script type='text/javascript'>
$(document).ready(function(){
$('#department').change(function(){
var department = $(this).val();
$('#employee').html('<option value="">Select Employee</option>'); //Resetting employee dropdown here
$.ajax({
url: "<?php echo base_url();?>admin/payroll/fetch_employee",
method: "POST",
data: {department_id: department},
success: function(data)
{
$('#employee').html(data);
}
});
});
});
</script>
HTML应该是这样的
<select id="employee">
<option value=''>Select Employee</option>
<option value='Jhon'>Jhon</option>
<option value='Smith'>Smith</option>
<option value='Elia'>Elia</option>
</select>
<select id="department">
<option value=''>Select Department</option>
<option value='IT'>IT</option>
<option value='HR'>HR</option>
<option value='Accounts'>Accounts</option>
</select>
在JSFiddle上查看现场演示
推荐阅读
- python - 有没有办法循环mysql数据并执行它
- python - 如何在 Bokeh 中绘制人物
- symfony - 如何在 Symfony 中同时使用 Assert\File 和 Assert\Image?
- python - 如何将 Kivy TextInput 调用到我的 Python 函数中?
- php - 如何在角度 7 中修复“刚刚评估过以下值”
- javascript - 尝试使用快速 js 路由解析 API 响应时的 HPE_INVALID_HEADER_TOKEN
- python - webdriver 找不到带有 jscontroller 的显示更多链接
- python - 为什么 asyncio 需要一个特殊的信号处理程序?
- asp.net - 用户名或密码不正确
- sql - SQL Server 2012 消息“CREATE VIEW”必须是查询批处理中的第一条语句