zoukankan      html  css  js  c++  java
  • EasyUI可编辑datagrid用combobox实现多级联动

    <body>  
        <script type="text/javascript">  
        $(function(){  
            var editing ; //判断用户是否处于编辑状态   
            var flag  ;   //判断新增和修改方法  
            $('#set_schedule').datagrid({  
                        idField:'id' ,  
                        fitColumns: false  ,  
                        url:'scheduleAction_loadScheduleData.action?sureDocumentId='+$("#sureDocumentId").val() ,  
                        striped: true ,   
                        loadMsg: '数据正在加载,请耐心的等待...' ,  
                        rownumbers:true ,  
                        singleSelect : true,   
                        frozenColumns:[[  
                                {field:'ck' , checkbox:true}                                      
                        ]],  
                        columns:[[  
                            {  
                                field:'dateTime' ,  
                                title:'时间' ,  
                                100 ,  
                                align:'center' ,  
                                editor:{  
                                    type:'datebox' ,   
                                    options:{  
                                        required:true ,   
                                        missingMessage:'时间必填!' ,  
                                        editable:false   
                                    }  
                                }  
                            },  
                            {  
                                field:'morningTime' ,  
                                title:'上午上课时间段' ,  
                                126 ,  
                                align:'center',   
                                editor:{  
                                    type:'validatebox' ,  
                                    options:{  
                                        required:true ,   
                                        missingMessage:'时间段必填!'  
                                    }  
                                }  
                            },  
                            {  
                                field:'morningCourse' ,   
                                title:'上午课程' ,  
                                100 ,   
                                editor:{  
                                    type:'validatebox' ,  
                                    options:{  
                                        required:true ,   
                                        missingMessage:'课程必填!'  
                                    }  
                                }  
                            },  
                            {  
                                field:'aa1' ,   
                                title:'主讲老师分类' ,  
                                100 ,   
                                editor : {    
                                    type : 'combobox',    
                                    options : {    
                                        url:'codeTypeAction_search.action?parentId=0&type=27',  
                                        valueField:'id' ,   
                                        textField:'name',  
                                        onSelect:function(data){  
                                            var row = $('#set_schedule').datagrid('getSelected');  
                                            var rowIndex = $('#set_schedule').datagrid('getRowIndex',row);//获取行号  
                                            var thisTarget = $('#set_schedule').datagrid('getEditor', {'index':rowIndex,'field':'aa1'}).target;  
                                            var value = thisTarget.combobox('getValue');  
                                              
                                            var target = $('#set_schedule').datagrid('getEditor', {'index':rowIndex,'field':'bb1'}).target;  
                                            target.combobox('clear'); //清除原来的数据  
                                            var url = 'codeTypeAction_search.action?type=28&parentId='+value;  
                                            target.combobox('reload', url);//联动下拉列表重载  
                                        }  
                                    }    
                                }    
                            },  
                            {  
                                field:'bb1' ,   
                                title:'主讲老师细类' ,  
                                100 ,   
                                editor : {    
                                    type : 'combobox',    
                                    options : {    
                                        url:'codeTypeAction_search.action?type=28',  
                                        valueField:'id' ,   
                                        textField:'name',  
                                        onSelect:function(data){  
                                            var row = $('#set_schedule').datagrid('getSelected');  
                                            var rowIndex = $('#set_schedule').datagrid('getRowIndex',row);//获取行号  
                                            var thisTarget = $('#set_schedule').datagrid('getEditor', {'index':rowIndex,'field':'bb1'}).target;  
                                            var value = thisTarget.combobox('getValue');  
                                              
                                            var target = $('#set_schedule').datagrid('getEditor', {'index':rowIndex,'field':'morningTeacherId'}).target;  
                                            target.combobox('clear'); //清除原来的数据  
                                            var url = 'teacherAction_search.action?teacherTypeId2='+value;  
                                            target.combobox('reload', url);//联动下拉列表重载  
                                        }  
                                    }    
                                }    
                            },  
                            {  
                                field:'morningTeacherId' ,  
                                title:'主讲老师' ,  
                                100 ,   
                                editor : {    
                                    type : 'combobox',    
                                    options : {    
                                        url:'teacherAction_search.action',  
                                        valueField:'id' ,   
                                        textField:'name'  
                                    }    
                                }    
                            },  
                            {  
                                field:'afternoonTime' ,  
                                title:'下午上课时间段' ,  
                                126 ,  
                                align:'center' ,   
                                editor:{  
                                    type:'validatebox' ,  
                                    options:{  
                                        required:true ,   
                                        missingMessage:'时间段必填!'  
                                    }  
                                }  
                            },  
                            {  
                                field:'afternoonCourse' ,   
                                title:'下午课程' ,  
                                100  ,   
                                editor:{  
                                    type:'validatebox' ,  
                                    options:{  
                                        required:true ,   
                                        missingMessage:'课程必填!'  
                                    }  
                                }  
                            },  
                            {  
                                field:'aa2' ,   
                                title:'主讲老师分类' ,  
                                100 ,   
                                editor : {    
                                    type : 'combobox',    
                                    options : {    
                                        url:'codeTypeAction_search.action?parentId=0&type=27',  
                                        valueField:'id' ,   
                                        textField:'name',  
                                        onSelect:function(data){  
                                            var row = $('#set_schedule').datagrid('getSelected');  
                                            var rowIndex = $('#set_schedule').datagrid('getRowIndex',row);//获取行号  
                                            var thisTarget = $('#set_schedule').datagrid('getEditor', {'index':rowIndex,'field':'aa2'}).target;  
                                            var value = thisTarget.combobox('getValue');  
                                              
                                            var target = $('#set_schedule').datagrid('getEditor', {'index':rowIndex,'field':'bb2'}).target;  
                                            target.combobox('clear'); //清除原来的数据  
                                            var url = 'codeTypeAction_search.action?type=28&parentId='+value;  
                                            target.combobox('reload', url);//联动下拉列表重载  
                                        }  
                                    }    
                                }    
                            },  
                            {  
                                field:'bb2' ,   
                                title:'主讲老师细类' ,  
                                100 ,   
                                editor : {    
                                    type : 'combobox',    
                                    options : {    
                                        url:'codeTypeAction_search.action?type=28',  
                                        valueField:'id' ,   
                                        textField:'name',  
                                        onSelect:function(data){  
                                            var row = $('#set_schedule').datagrid('getSelected');  
                                            var rowIndex = $('#set_schedule').datagrid('getRowIndex',row);//获取行号  
                                            var thisTarget = $('#set_schedule').datagrid('getEditor', {'index':rowIndex,'field':'bb2'}).target;  
                                            var value = thisTarget.combobox('getValue');  
                                              
                                            var target = $('#set_schedule').datagrid('getEditor', {'index':rowIndex,'field':'afternoonTeacherId'}).target;  
                                            target.combobox('clear'); //清除原来的数据  
                                            var url = 'teacherAction_search.action?teacherTypeId2='+value;  
                                            target.combobox('reload', url);//联动下拉列表重载  
                                        }  
                                    }    
                                }    
                            },  
                            {  
                                field:'afternoonTeacherId' ,  
                                title:'主讲老师' ,  
                                100 ,   
                                editor : {    
                                    type : 'combobox',    
                                    options : {    
                                        url:'teacherAction_search.action',  
                                        valueField:'id' ,   
                                        textField:'name'  
                                    }    
                                }    
                            },  
                            {  
                                field:'eveningTime' ,  
                                title:'晚上上课时间段' ,  
                                126 ,  
                                align:'center'  ,   
                                editor:{  
                                    type:'validatebox' ,  
                                    options:{  
                                        required:true ,   
                                        missingMessage:'时间段必填!'  
                                    }  
                                }  
                            },  
                            {  
                                field:'eveningCourse' ,   
                                title:'晚上课程' ,  
                                100  ,   
                                editor:{  
                                    type:'validatebox' ,  
                                    options:{  
                                        required:true ,   
                                        missingMessage:'课程必填!'  
                                    }  
                                }  
                            },  
                            {  
                                field:'aa3' ,   
                                title:'主讲老师分类' ,  
                                100 ,   
                                editor : {    
                                    type : 'combobox',    
                                    options : {    
                                        url:'codeTypeAction_search.action?parentId=0&type=27',  
                                        valueField:'id' ,   
                                        textField:'name',  
                                        onSelect:function(data){  
                                            var row = $('#set_schedule').datagrid('getSelected');  
                                            var rowIndex = $('#set_schedule').datagrid('getRowIndex',row);//获取行号  
                                            var thisTarget = $('#set_schedule').datagrid('getEditor', {'index':rowIndex,'field':'aa3'}).target;  
                                            var value = thisTarget.combobox('getValue');  
                                              
                                            var target = $('#set_schedule').datagrid('getEditor', {'index':rowIndex,'field':'bb3'}).target;  
                                            target.combobox('clear'); //清除原来的数据  
                                            var url = 'codeTypeAction_search.action?type=28&parentId='+value;  
                                            target.combobox('reload', url);//联动下拉列表重载  
                                        }  
                                    }    
                                }    
                            },  
                            {  
                                field:'bb3' ,   
                                title:'主讲老师细类' ,  
                                100 ,   
                                editor : {    
                                    type : 'combobox',    
                                    options : {    
                                        url:'codeTypeAction_search.action?type=28',  
                                        valueField:'id' ,   
                                        textField:'name',  
                                        onSelect:function(data){  
                                            var row = $('#set_schedule').datagrid('getSelected');  
                                            var rowIndex = $('#set_schedule').datagrid('getRowIndex',row);//获取行号  
                                            var thisTarget = $('#set_schedule').datagrid('getEditor', {'index':rowIndex,'field':'bb3'}).target;  
                                            var value = thisTarget.combobox('getValue');  
                                              
                                            var target = $('#set_schedule').datagrid('getEditor', {'index':rowIndex,'field':'eveningTeacherId'}).target;  
                                            target.combobox('clear'); //清除原来的数据  
                                            var url = 'teacherAction_search.action?teacherTypeId2='+value;  
                                            target.combobox('reload', url);//联动下拉列表重载  
                                        }  
                                    }    
                                }    
                            },  
                            {  
                                field:'eveningTeacherId' ,  
                                title:'主讲老师' ,  
                                100 ,   
                                editor : {    
                                    type : 'combobox',    
                                    options : {    
                                        url:'teacherAction_search.action',  
                                        valueField:'id' ,   
                                        textField:'name'  
                                    }    
                                }    
                            }  
                        ]] ,  
                        pagination: true ,   
                        pageSize: 10 ,  
                        pageList:[5,10,15,20,50] ,  
                        toolbar:[  
                            {  
                                text:'新增课程',  
                                iconCls:'icon-add' ,   
                                handler:function(){  
                                                if(editing == undefined){  
                                                    flag = 'add';  
                                                    //1 先取消所有的选中状态  
                                                    $('#set_schedule').datagrid('unselectAll');  
                                                    //2追加一行  
                                                    $('#set_schedule').datagrid('appendRow',{description:''});  
                                                    //3获取当前页的行号  
                                                    editing = $('#set_schedule').datagrid('getRows').length -1;  
                                                    //4选中并开启编辑状态  
                                                    $('#set_schedule').datagrid('selectRow',editing);  
                                                    $('#set_schedule').datagrid('beginEdit', editing);  
                                                }  
                                        }  
                            }/* ,{ 
                                text:'修改课程', 
                                iconCls:'icon-edit' ,  
                                handler:function(){ 
                                        var arr = $('#set_schedule').datagrid('getSelections'); 
                                        if(arr.length != 1){ 
                                                $.messager.show({ 
                                                    title:'提示信息', 
                                                    msg:'只能选择一条记录进行修改!'  
                                                }); 
                                        } else { 
                                            if(editing == undefined){ 
                                                flag = 'edit'; 
                                                 
                                                //根据行记录对象获取该行的索引位置 
                                                editing = $('#set_schedule').datagrid('getRowIndex' , arr[0]); 
                                                //开启编辑状态 
                                                $('#set_schedule').datagrid('beginEdit',editing); 
                                            } 
                                        } 
                                         
                                }                                        
                            } */,{  
                                text:'保存课程',  
                                iconCls:'icon-save' ,   
                                handler:function(){  
                                        //保存之前进行数据的校验 , 然后结束编辑并师傅编辑状态字段   
                                        if($('#set_schedule').datagrid('validateRow',editing)){  
                                                $('#set_schedule').datagrid('endEdit', editing);  
                                                editing = undefined;  
                                        }  
                                }  
                            },{  
                                text:'删除课程',  
                                iconCls:'icon-remove' ,   
                                handler:function(){  
                                    var arr = $('#set_schedule').datagrid('getSelections');  
                                    if(arr.length <= 0 ){  
                                        $.messager.show({  
                                            title:'提示信息',  
                                            msg:'请选择进行删除操作!'  
                                        });                                           
                                    } else {  
                                        $.messager.confirm('提示信息' , '确认删除?' , function(r){  
                                            if(r){  
                                                var ids = '';  
                                                for(var i = 0 ; i < arr.length ; i++){  
                                                    ids += arr[i].id + ',';  
                                                }  
                                                ids = ids.substring(0,ids.length-1);  
                                                $.post('scheduleAction_delete.action' , {ids:ids},function(result){  
                                                        $('#set_schedule').datagrid('reload');  
                                                        $.messager.show({  
                                                            title:'提示信息',  
                                                            msg:'操作成功!'  
                                                        });  
                                                });  
                                                  
                                            } else {  
                                                 return ;  
                                            }  
                                        });  
                                    }  
                                }  
                            },{  
                                text:'取消操作',  
                                iconCls:'icon-cancel' ,   
                                handler:function(){  
                                    //回滚数据   
                                    $('#set_schedule').datagrid('rejectChanges');  
                                    editing = undefined;  
                                }  
                            }     
                        ] ,  
                        onAfterEdit:function(index , record){  
                            var data = $('#moduleform').serialize();  
                            $.post(flag=='add'?'scheduleAction_addSchedule.action?'+data:'scheduleAction_updateSchedule.action' , record , function(result){  
                                var data = $.parseJSON(result);   
                                $('#set_schedule').datagrid('reload');  
                                $.messager.show({  
                                        title:'提示信息',  
                                        msg:data.message  
                                    });  
                            },'text');  
                        }  
                              
                          
                });  
              
              
              
              
        });  
              
        </script>  
            <form id="moduleform" method="post">  
                <s:hidden name="sureDocumentId" id="sureDocumentId"></s:hidden>  
                <table  cellspacing="1" cellpadding="5" class="tb_background2" width="100%">    
                    <tr>  
                        <td width="20%" class="td_right">总学时:</td>  
                        <td width="28%" class="td_left">  
                            <s:textfield name="totalLearnTime" id="totalLearnTime" size="32"/>学时  
                        </td>  
                        <td width="20%" class="td_right">是否可见:</td>  
                        <td width="28%" class="td_left">  
                            <s:select list="#{'0':'可见','1':'不可见' }" cssStyle="200px;" name="type" id="type"></s:select>  
                        </td>  
                    </tr>  
                </table>  
            </form>  
            <table id="set_schedule"></table>  
      </body>  
  • 相关阅读:
    很不错的WebCart控件,分享给大家
    Atitit 功能扩展法细则条例 目录 1. 界面ui扩展 2 1.1. 使用h5做界面 2 1.2. 自制h5 ide。。简化ui自定义配置 2 2. 业务逻辑扩展 2 2.1. Bpm流程引擎还
    Atitit 持久化与数据存储标准化规范 目录 1. 存储的附加功能 2 1.1. 基本存取功能 2 1.2. 全文检索(imap 2 1.3. 属性检索 2 1.4. 查询语言 2 2. 基于内容
    Atitit 常见硬件集成列表 目录 1.1. 小程序设备类 1 1.2. atitit.常见手机的传感器与外设 attilax总结 1 1.3. Pc机外设 1 1.4. 设备管理器 2 1.1
    Atitit 项目wechat微信截屏生成vcf通讯录384 个 384个人 42个节拍,平均每个8个人 技术点 im图像裁剪, ocr Tesseract Vcf格式 /wechatTel
    atitit 音频 项目 系列功能表 音乐 v3 t67.docx Atitit 音频 项目 系列功能表 音频 音乐 语言领域的功能表 听歌识曲功能 酷我功能。 铃声 功能。。 音频切割(按照副歌部
    Atitit spring springboot 集成mybatis法 目录 1.1. 使用spring管理数据源。。需要修改spring、 配置 1 1.2. 直接代码集成,无需修改任何配置 1
    Atitit 艾提拉音频资源列表与统计 t6 六月份战果与7月份规划.docx 目录 1. 第一层次 原始资源类 采集资源类 1 1.1. K歌类采集资源 整理 1 1.2. K歌类资源初步分类
    Atitit 长距离无线通信法 LoRa NBIoT NBCIoT LoRa是Semtech公司的创新发明,该技术向用户提供显著的长距离、低功耗、安全数据传输机制。使用LoRa技术构建的公用网
    Atitit 读取音频音乐文件的bpm 目录 1.1. Librosa是一个用于音频、音乐分析、处理的python工具包, 1 1.2. \bpm.py 1 1.3. Echo 2 1.4. Cod
  • 原文地址:https://www.cnblogs.com/zhengenru2008/p/6049599.html
Copyright © 2011-2022 走看看