checkbox控制Input是否可以用以及下拉框的级联——easyUI

实现的功能是:1、点击“是否替换”控制input(关联工序)是否可用,

2、点击机种后点击关联工程才会查询出数据(并且是根据机种的ID),关联工序是根据关联工程!

机种——>关联工程——>关联工序******他们三个是级联关系,

<tr>

<td class='inLabel' width="40px">机种:</td>
<td width="240px">
<input id="input_add_opProcesses_jizhong"  data-options="editable:false" 
class="easyui-combobox" width="100%"  >
</td>
</tr>
<tr>
<td class='inLabel' width="40px">关联工程:</td>
<td width="240px">
<input id="input_add_opProcesses_engineering"  data-options="valueField:'id',textField:'text',editable:false" 
class="easyui-combobox" width="100%"  >
</td>
</tr>
<tr>
<td class='inLabel' width="40px"></td>
<td width="240px">
<input id="input_add_opProcesses_change"  data-options="editable:false"  type="checkBox"
width="100%" οnclick="change()" >是否替换<br/>
</td>
</tr>
<tr id="related_processes">
<td class='inLabel' width="40px">关联工序:</td>
<td width="240px">
<input id="input_add_opProcesses_processes"  data-options="valueField:'id',textField:'text',editable:false" 
 class="easyui-combobox" width='240px'  >
</td>

</tr>

JS:

/*
*单选按钮选中事件
*/
function change(){
console.log($('#input_add_opProcesses_change').attr('checked'));
  if($('#input_add_opProcesses_change').attr('checked') == 'checked'){
  $('#input_add_opProcesses_processes').combobox({disabled:true});
  $('#input_add_opProcesses_change').removeAttr('checked');
  }
  else{
  $('#input_add_opProcesses_processes').combobox({disabled:false});
  $('#input_add_opProcesses_change').attr('checked','checked');
  //当是否替换勾上了,才去数据库中查询关联工序的数据!!!!!!!
  var machineTypeId=$("#input_add_opProcesses_jizhong").combobox('getValue');
  var engineeringId=$("#input_add_opProcesses_engineering").combobox('getValue')
  $('#input_add_opProcesses_processes').combobox({
     url:'${pageContext.request.contextPath}/Processes/getAllProcesseslist?machineTypeId='+machineTypeId + '&eneeringId='+ engineeringId,
     panelHeight:'auto',
  });
  }
}
/*
 * 下拉框级联
 */
$('#input_add_opProcesses_jizhong').combobox({
    url:'${pageContext.request.contextPath}/machineType/getAllMachineTypelist',
    panelHeight:'auto',
    onChange:function(machineId){
      $('#input_add_opProcesses_engineering').combobox({
      url:'${pageContext.request.contextPath}/Engineering/getAllEngineeringlist?machineTypeId='+machineId,
      panelHeight:'auto',
      onChange:
     function(eneeringId){
     //当当是否替换勾上了,才去数据库中查询关联工序的数据!!!这里是以防用户上来就勾上替换,然后去选择机种、工程后再去选择工序时不会去查询数据库!!!!
     if($('#input_add_opProcesses_change').attr('checked') == 'checked'){
     $('#input_add_opProcesses_processes').combobox({
    url:'${pageContext.request.contextPath}/Processes/getAllProcesseslist?machineTypeId='+machineId + '&eneeringId='+ eneeringId,
        panelHeight:'auto',
     });
     }
      
      }
  });
    }
 });


$(function(){
$('#input_add_opProcesses_processes').combobox({disabled:true});
/**
*机种下拉框默认选择了第一值
*/
$('#input_add_opProcesses_jizhong').combobox({
        url:'${pageContext.request.contextPath}/machineType/getAllMachineTypelist',
        valueField:'id',
        textField:'text',
onLoadSuccess: function (data) {
if (data) {
   $('#input_add_opProcesses_jizhong').combobox('setValue',data[0].id);
}
}
});
$("#input_add_opProcesses_opProcesses").focus();
});