• 页面上移、下移、保存、编辑备份


    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
    <%@include file="/context/mytags.jsp"%>
    <t:base type="jquery,easyui,tools,DatePicker"></t:base>  
      <t:datagrid name="sonList1" checkbox="true" fitColumns="false"   title="excel模板" sortName="sortNumber" sortOrder="asc" pagination="true" pageSize="200" onDblClick="editRow('','','sonList1')" 
                   actionUrl="fileCustemplateController.do?datagrid1&templatefid=${templatefid }" idField="id" fit="true" queryMode="group" extendParams="view:scrollview">
        <t:dgCol title="id"  field="id" hidden="true"  queryMode="group"  width="120"></t:dgCol>
        <t:dgCol title="代号"  field="sortNumber"  queryMode="group"  width="120" ></t:dgCol>
        <t:dgCol title="列名"  field="templateTargetname" query="true" queryMode="single"  width="120" extendParams="editor:'text'"></t:dgCol>
        <t:dgCol title="映射列名称"  field="templateOrgincolumn"  queryMode="single"  width="120" extendParams="editor:'text'"></t:dgCol>
        <t:dgCol title="映射列代号"  field="templateOrginid"  queryMode="single"  width="120" extendParams="editor:'numberbox'"></t:dgCol>
        <t:dgCol title="映射列key"  field="templateOrginkey"  queryMode="single"  width="120" extendParams="editor:'text'"></t:dgCol>
      
        <t:dgToolBar  title="录入" icon="icon-add"  funname="addRow"></t:dgToolBar>
        <t:dgToolBar  title="编辑" icon="icon-edit"  funname="editRow"></t:dgToolBar>
        <t:dgToolBar  title="保存" icon="icon-save" url="fileCustemplateController.do?saveRows1" funname="saveData"></t:dgToolBar>
        <t:dgToolBar  title="取消编辑" icon="icon-undo" funname="reject"></t:dgToolBar>
        <t:dgToolBar title="批量删除"  icon="icon-remove" url="fileCustemplateController.do?doExcelcolumnDel" funname="deleteALLSelect"></t:dgToolBar>
        <t:dgToolBar  title="上移" icon="icon-undo" funname="goUp"></t:dgToolBar>
        <t:dgToolBar  title="下移" icon="icon-undo" funname="goDown"></t:dgToolBar> 
        
      </t:datagrid>
         
     <script type="text/javascript"> 
        //上移
        function goUp(title,addurl,gname){
             var row = $('#'+gname).datagrid('getSelected');
             var index = $('#'+gname).datagrid('getRowIndex', row);
             mysort(index, 'up', gname);
         }
        //下移
        function goDown(title,addurl,gname){
             var row = $('#'+gname).datagrid('getSelected');
             var index = $('#'+gname).datagrid('getRowIndex', row);
             mysort(index, 'down', gname);
         }
        //移动动作
        function mysort(index, type, gridname) {
            if ("up" == type) {
                if (index != 0) { 
                    var toup = $('#' + gridname).datagrid('getData').rows[index];
                    var todown = $('#' + gridname).datagrid('getData').rows[index - 1];
                    var oldsortNumber = toup.sortNumber; 
                    var newsortNumber = todown.sortNumber; 
                    todown.sortNumber=oldsortNumber;
                    $('#' + gridname).datagrid('getData').rows[index] = todown;
                    toup.sortNumber=newsortNumber;
                    $('#' + gridname).datagrid('getData').rows[index - 1] = toup;
                    $('#' + gridname).datagrid('refreshRow', index);
                    $('#' + gridname).datagrid('refreshRow', index - 1);
                    $('#' + gridname).datagrid('selectRow', index - 1); 
    
                    $('#' + gridname).datagrid('unselectRow', index);//不选中
                }else{
                    $.messager.alert('提示','已为第一行!')
                }
            } else if ("down" == type) {
                var rows = $('#' + gridname).datagrid('getRows').length;
                if (index != rows - 1) {
                    var todown = $('#' + gridname).datagrid('getData').rows[index];
                    var toup = $('#' + gridname).datagrid('getData').rows[index + 1];
                    var oldsortNumber = toup.sortNumber; 
                    var newsortNumber = todown.sortNumber; 
                    todown.sortNumber=oldsortNumber;
                    $('#' + gridname).datagrid('getData').rows[index + 1] = todown;
                    toup.sortNumber=newsortNumber;
                    $('#' + gridname).datagrid('getData').rows[index] = toup;
                    $('#' + gridname).datagrid('refreshRow', index);
                    $('#' + gridname).datagrid('refreshRow', index + 1);
                    $('#' + gridname).datagrid('selectRow', index + 1);
                    $('#' + gridname).datagrid('unselectRow', index);//不选中
                }else{
                    $.messager.alert('提示','已为最后一行!')
                }
            }
     }     
     
        //添加行
        function addRow(title,addurl,gname){
            var maxIndex = $('#'+gname).datagrid('getRows').length+1;
            $('#'+gname).datagrid('appendRow',{"sortNumber":maxIndex});
            var editIndex = $('#'+gname).datagrid('getRows').length-1; 
            $('#'+gname).datagrid('selectRow', editIndex).datagrid('beginEdit', editIndex);
        }
        //保存数据
        function saveData(title,addurl,gname){     
            if(!endEdit(gname))
                return false;
            var rows=$('#'+gname).datagrid("getRows");
     
            var result={};
            for(var i=0;i<rows.length;i++){
                for(var d in rows[i]){
                    result["fcecentity["+i+"]."+d]=rows[i][d];
                }
            }
            console.log(result)
            addurl+='&templatefid=${templatefid}';
            $.ajax({
                url:"<%=basePath%>/"+addurl,
                type:"post",
                data:result,
                dataType:"json",
                success:function(data){
                    tip(data.msg);
                    if(data.success){
                        reloadTable();
                    }
                }
            })
        }
        
        //结束编辑
        function endEdit(gname){
            var  editIndex = $('#'+gname).datagrid('getRows').length-1;
            for(var i=0;i<=editIndex;i++){
                if($('#'+gname).datagrid('validateRow', i)){
                    $('#'+gname).datagrid('endEdit', i);
                }else{
                    tip("请选择必填项(带有红色三角形状的字段)!");
                    return false;
                }
            }
            return true;
        }
        
        //编辑行
        function editRow(title,addurl,gname){
            var rows=$('#'+gname).datagrid("getChecked");
            if(rows.length==0){
                tip("请选择条目");
                return false;
            }
            for(var i=0;i<rows.length;i++){
                var index= $('#'+gname).datagrid('getRowIndex', rows[i]);
                $('#'+gname).datagrid('beginEdit', index);
                //
                var ed = $('#'+gname).datagrid('getEditor', {index:index,field:"templateOrginid"});
                var templateOrgincolumn = $('#'+gname).datagrid('getEditor', {index:index,field:"templateOrgincolumn"});
                var templateOrginkey = $('#'+gname).datagrid('getEditor', {index:index,field:"templateOrginkey"});
                $(ed.target).change(function(){  
                      var res = $(this).val();
                      $.ajax({
                            url : "fileCustemplateController.do?getRes&res="+res,
                            type:'GET',
                            dataType:'JSON',
                            delay: 250,
                            cache: true,
                            success: function(data){
                                var col_name = data[0].col_name;
                                var col_code = data[0].col_code;   
                                 $(templateOrgincolumn.target).val(col_name)
                                 $(templateOrginkey.target).val(col_code)
                               
                            }
                        });
                });
            }
        }
        
        
        //取消编辑
        function reject(title,addurl,gname){
            $('#'+gname).datagrid('clearChecked');
            $('#'+gname).datagrid('rejectChanges');
    
        }
     
     $(document).ready(function(){
        
         
     });
     
     </script>
  • 相关阅读:
    前后端分离的思想
    原生js瀑布流
    瀑布流懒加载
    js的垃圾回收机制
    TCP三次挥手四次握手
    HTTP与HTTPS的区别
    http报文
    前后端的分离
    express中间件
    vue生命周期钩子函数解读步骤
  • 原文地址:https://www.cnblogs.com/xueblvip/p/14818856.html
Copyright © 2020-2023  润新知