easyui datagrid 表格内改变数据,改变其他单元格数据(2)

8 篇文章 0 订阅

接上篇:

上篇遗留个问题,虽然能够改变一个cell进行改变另外一个cell,但是如果另外一个cell的数据是通过这个cell的某种操作进行重新获得的combobox就有问题

解决方法:

依然是在onBeginEdit中,只不过这次是像普通的combobox获取数据,不过有个问题,这里的数据要提前或者,否者url的reload,传递的是POST方式,而不是GET方式,这个是有问题的

editorJbfl.target.combobox({
onSelect:function(obj){
editorOther.target.textbox('setValue',obj.jbdm);
// editorwell.target.combobox('reload',"/wzdemo/findWellByJb/"+obj.jbdm);
getWellsByJb(obj.jbdm);
editorwell.target.combobox({
        valueField:'wellId',
textField:'jm',
data:wells,
required:true
});
}
});

onBeginEdit : function(rowIndex, rowData){
console.log("onBeginEdit");
var rowdata = $("#demowells").datagrid("getEditors",rowIndex);
console.log(rowdata);
var editorJbfl = rowdata[2];
var editorOther = rowdata[3];
var editorwell = rowdata[4];
editorJbfl.target.combobox({
onSelect:function(obj){
editorOther.target.textbox('setValue',obj.jbdm);
// editorwell.target.combobox('reload',"/wzdemo/findWellByJb/"+obj.jbdm);
getWellsByJb(obj.jbdm);
editorwell.target.combobox({
        valueField:'wellId',
textField:'jm',
data:wells,
required:true
});
}
});

}



全部代码

$.extend($.fn.datagrid.methods, {

    /* 删除选中行 */
    deleteSelectedRow: function (datagrid, url) {
        console.log("deleteSelectedRow");
        var row = datagrid.datagrid("getSelected");

        if (row == undefined) {
            $.messager.show({
                title: "系统提示",
                msg: "请选择要操作的行",
                width: 350,
                heigth: 200,
                style: {
                    top: document.body.scrollTop + document.documentElement.scrollTop,
                }
            });
            return;
        }
    }

})

var products = [
    {productid:'FI-SW-01',name:'Koi'},
    {productid:'K9-DL-01',name:'Dalmation'},
    {productid:'RP-SN-01',name:'Rattlesnake'},
    {productid:'RP-LI-02',name:'Iguana'},
    {productid:'FL-DSH-01',name:'Manx'},
    {productid:'FL-DLH-02',name:'Persian'},
    {productid:'AV-CB-01',name:'Amazon Parrot'}
];

var jbfldms =[];
var wells = [];

function getJbfldms(){
    $.ajax({  
        type:"GET",
        url:"/wzdemo/findAllJbfl" ,
        dataType:"json",
        async:false,
        success:function(data){
            console.log(data);
            jbfldms = data;
        }
    });
}

function getAllWells(){
    $.ajax({  
        type:"GET",
        url:"/wzdemo/findAllWell" ,
        dataType:"json",
        async:false,
        success:function(data){
            console.log(data);
            wells = data;
        }
    });
}

function getWellsByJb(jbdm){
    $.ajax({  
        type:"GET",
        url:"/wzdemo/findWellByJb/"+jbdm ,
        dataType:"json",
        async:false,
        success:function(data){
            console.log(data);
            wells = data;
        }
    });
}
        
$(function(){
//    getAllWells();
    getJbfldms();
      $("#demowells").datagrid({
          title:'Editable DataGrid',
        iconCls:'icon-edit',
        width:660,
        height:250,
        singleSelect:true,
        idField:'demoId',
        columns:[[    
            {field:'demoId',title:'demoId',width:100,editor:'text'},
            {field:'demoName',title:'demoName',width:100,editor:'text'},    
            {field:'demoJbid',title:'demoJbName',width:100,editor:'text',
                formatter:function(value){
                    for(var i=0; i<jbfldms.length; i++){
                        if (jbfldms[i].jbdm == value) return jbfldms[i].jb;
                        }
                        return value;
                },
                editor:{
                    type:'combobox',
                    options:{
                        valueField:'jbdm',
                        textField:'jb',
                        data:jbfldms,
                        required:true
                    }
                }
            },    
            {field:'demoOther',title:'demoOther',width:100,align:'right',editor:'textbox'},
            {field:'wellId',title:'wellName',width:100,
                formatter:function(value){
                    for(var i=0; i<wells.length; i++){
                        if (wells[i].wellId == value) return wells[i].jm;
                        }
                        return value;
                },
                editor:{
                    type:'combobox',
                    options:{
                        type:'GET',
                        valueField:'wellId',
                        textField:'jm',
                        data:wells,
                        required:true
                    }
                }
            },
            {field:'action',title:'Action',width:80,align:'center',
                formatter:function(value,row,index){
                    console.log(row);
                    console.log(index);
                    if (row.editing){
                        var s = '<a href="#" οnclick="saverow(this)">Save</a> ';
                        var c = '<a href="#" οnclick="cancelrow(this)">Cancel</a>';
                        return s+c;
                    } else {
                        var e = '<a href="#" οnclick="editrow(this)">Edit</a> ';
                        var d = '<a href="#" οnclick="deleterow(this)">Delete</a>';
                        return e+d;
                    }
                }
            }   
        ]],
        onBeforeEdit:function(index,row){
            row.editing = true;
            updateActions(index);
        },
        onAfterEdit:function(index,row){
            row.editing = false;
            updateActions(index);
        },
        onCancelEdit:function(index,row){
            row.editing = false;
            updateActions(index);
        },
        onClickRow:function(rowIndex, rowData){
//            console.log("onClickRow index = "+rowIndex);
        },
        onClickCell:function(rowIndex, field, value){
            console.log("onClickCell index = "+rowIndex);
        },
        onBeginEdit : function(rowIndex, rowData){
            console.log("onBeginEdit");
            var rowdata = $("#demowells").datagrid("getEditors",rowIndex);
            console.log(rowdata);
            var editorJbfl = rowdata[2];
            var editorOther = rowdata[3];
            var editorwell = rowdata[4];
            editorJbfl.target.combobox({
                onSelect:function(obj){
                    editorOther.target.textbox('setValue',obj.jbdm);
//                    editorwell.target.combobox('reload',"/wzdemo/findWellByJb/"+obj.jbdm);//use POST ,not use
                    getWellsByJb(obj.jbdm);
                    editorwell.target.combobox({
                        valueField:'wellId',
                        textField:'jm',
                        data:wells,
                        required:true
                    });
                }
            });
        }
      });
});

var editIndex = -1;
function endEditing(){
    if (editIndex == -1){
        return true;
    }else{
        return false;
    }
    if ($('#demowells').datagrid('validateRow', editIndex)){
        editIndex = -1;
        return true;
    } else {
        return false;
    }
}

function getRowIndex(target){
    console.log("getRowIndex");
    console.log(target);
    var tr = $(target).closest('tr.datagrid-row');
    return parseInt(tr.attr('datagrid-row-index'));
}
        
function editrow(target){
    $('#demowells').datagrid('beginEdit', getRowIndex(target));
}
    
function deleterow(target){
    $.messager.confirm('Confirm','Are you sure?',function(r){
        if (r){
            $('#demowells').datagrid('deleteRow', getRowIndex(target));
            editIndex = -1;

//            $('#demowells').datagrid('deleteSelectedRow');
        }
    });
}

function saverow(target){
    $('#demowells').datagrid('endEdit', getRowIndex(target));
    editIndex = -1;
}

function cancelrow(target){
    $('#demowells').datagrid('cancelEdit', getRowIndex(target));
    editIndex = -1;
}

function updateActions(index){
    $('#demowells').datagrid('updateRow',{
        index: index,
        row:{}
    });
}

function insert(){
    var flag = endEditing();
    if(!endEditing())return;
    var row = $('#demowells').datagrid('getSelected');
    if (row){
        var index = $('#demowells').datagrid('getRowIndex', row);
    } else {
        index = 0;
    }
    $('#demowells').datagrid('insertRow', {
        index: index,
        row:{
//                    status:'P'
            }
        });
    $('#demowells').datagrid('selectRow',index);
    $('#demowells').datagrid('beginEdit',index);
    editIndex = index;
}

function changeProductId(obj){
    console.log("changeProductId");
    console.log(obj);
//    var rowdata = $("#demowells").datagrid("selectRow",editIndex);
//  var rowdata2 = $("#demowells").datagrid("getEditors",editIndex);普通状态不可使用
}


function saveall(){
    if(editIndex!=-1){
        alert("请对没一行进行保存");
        return;
    }
    var rows = $("#demowells").datagrid("getRows");
    console.log(rows);
    var datas = [];
    for(var i=0;i<rows.length;i++){
        var data = {};
//        data.demoId = rows[i].demoId;
        data.demoName = rows[i].demoName;
        data.demoJb = rows[i].demoJbid;
        data.demoOther = rows[i].demoOther;
        data.demoWellid = rows[i].wellId;
        datas.push(data);
    }
    console.log(JSON.stringify(datas));
    $.post("/wzdemo/adddemodata/"+JSON.stringify(datas),function(result){
        console.log(result);
    });
}


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值