bootstrap table行内列联动

bootstrap table行内列联动

代码

bootsrap table的联动，根据单价自动算金额：
var operatorPrice = {
            "change .price":function (e,value,row,index) {
                // var price = value || 0;//单价
                var price = $("#price"+index).val() || 0;//单价
                var realityAmount = row["realityAmount"] || 0;  //数量
                row['contractTotal'] =  price * realityAmount ;
                updateEditLastRow('bootstrap-table1');
            },
        }
        function loadtable_ycl() {
            var options = {
                id: "bootstrap-table1",
                toolbar: "toolbar2",
                url: ctx + "outsaleoutycl/yclattach/list",
                //data:datas,
                showSearch: false,
                showRefresh: false,
                showToggle: false,
                showColumns: false,
                pagination: false,
                columns: [{
                    field: "xh",
                    title: "序号",
                    halign: "center",
                    align: "center",
                    width: "2%",
                    formatter: function (value, row, index) {
                        return index + 1;
                    }
                }, {
                    field: 'orderNo',
                    title: '订单号',
                    halign: "center",
                    align: "center",
                },
                {
                    field: 'clId',
                    title: '材料编码',
                    halign: "center",
                    align: "center",
                }, {
                    field: 'clName',
                    title: '材料名称',
                    halign: "center",
                    align: "center",
                },
                {
                    field: 'specification',
                    title: '规格型号',
                    halign: "center",
                    align: "center",
                },
                {
                    field: 'gyde',
                    title: '工艺定额',
                    halign: "center",
                    align: "center",
                    formatter: function(value,index,row){
                        if(isEmpty(value)){
                            value = "";
                        }
                        var srt;
                        if(kgjg == "jh"){
                            str = '<div class="input-group" style="width:100%;">'
                                +'<input type="text" name="'+this.field+'" class="form-control" value="'+value+'" οnchange="enterKey(this)">'
                                +'<div>';
                        }else{
                            str = '<div class="input-group" style="width:100%;">'
                                +'<input disabled type="text" name="'+this.field+'" class="form-control" value="'+value+'" οnchange="enterKey(this)">'
                                +'<div>';
                        }
                        return str;
                    },
                },
                {
                    field: 'taskNum',
                    title: '任务数量',
                    halign: "center",
                    align: "center",
                    formatter: function(value,index,row){
                        if(isEmpty(value)){
                            value = "";
                        }
                        var srt;
                        if(kgjg == "jh"){
                            str = '<div class="input-group" style="width:100%;">'
                                +'<input type="text" name="'+this.field+'" class="form-control" value="'+value+'" οnchange="enterKey(this)">'
                                +'<div>';
                        }else{
                            str = '<div class="input-group" style="width:100%;">'
                                +'<input disabled type="text" name="'+this.field+'" class="form-control" value="'+value+'" οnchange="enterKey(this)">'
                                +'<div>';
                        }
                        return str;
                    },
                },
                {
                    field: 'measureUnit',
                    title: '计量单位',
                    width: "10%",
                    halign: "center",
                    align: "center",
                },
                {
                    field: 'applyAmount',
                    title: '申请数量',
                    halign: "center",
                    align: "center",
                },
                {
                    field: 'realityAmount',
                    title: '实际数量',
                    halign: "center",
                    align: "center",
                    formatter: function(value,index,row){
                        if(isEmpty(value)){
                            value = "";
                        }
                        var srt;
                        if(kgjg == "kg"){
                            str = '<div class="input-group" style="width:100%;">'
                                +'<input type="text" name="'+this.field+'" class="form-control" value="'+value+'" οnchange="enterKey(this)">'
                                +'<div>';
                        }else{
                            str = '<div class="input-group" style="width:100%;">'
                                +'<input disabled type="text" name="'+this.field+'" class="form-control" value="'+value+'" οnchange="enterKey(this)">'
                                +'<div>';
                        }
                        return str;
                    },
                },
                {
                    field: 'price',
                    title: '单价',
                    halign: "center",
                    align: "center",
                    formatter: function(value,row,index){
                        debugger;
                        if(isEmpty(value)){
                            value = "";
                        }
                        var srt;
                        if(kgjg == "jg"){
                            str = '<div class="input-group" style="width:100%;">'
                                +'<input id="'+this.field+index+'" type="text" name="'+this.field+'" class="form-control price" value="'+value+'" οnchange="enterKey(this)">'
                                +'<div>';
                        }else{
                            str = '<div class="input-group" style="width:100%;">'
                                +'<input disabled type="text" name="'+this.field+'" class="form-control" value="'+value+'" οnchange="enterKey(this)">'
                                +'<div>';
                        }
                        return str;
                        //updateEditLastRow('bootstrap-table1');
                    },
                    events:operatorPrice
                },
                {
                    field: 'contractTotal',
                    title: '金额',
                    halign: "center",
                    align: "center",
                    // formatter:function(value,index,row){
                    //    var str = '<div class="input-group" style="width:100%;">'
                    //         +'<input id="'+this.field+'" disabled type="text" class="form-control" style="border: 0">'
                    //         +'<div>';
                    //     return str;
                    // }
                },
                {
                    field: 'yt',
                    title: '用途',
                    halign: "center",
                    align: "center",
                    width: "15%",
                    formatter:function (value,row,index) {
                        if(isEmpty(value)){
                            value = "";
                        }
                        var str = '<div class="input-group" style="width:100%;">'
                            +'<textarea disabled type="text" name="'+this.field+'" class="form-control" value="'+value+'">'+value+'</textarea>'
                            +'<div>';
                        return str;
                    }
                },
                {
                    field: "id",
                    visible: false,
                }],
                queryParams: function () {
                    var param = {
                        yclMainId: sid
                    }
                    return param;
                },
                onLoadSuccess: function () {  //加载成功时执行
                    console.log("加载成功！！！");
                },
            };
            $.table.init(options);
        }
		
		
		function updateEditLastRow(tableId) {
		var table = $('#' + tableId);
		var obj = {};
		table.find("tbody tr").each(function () {
			var rowIndex = $(this).attr('data-index');
			$(this).find("input").each(function () {
				obj[$(this).attr('name')] = $(this).val();
			})
			$(this).find("select").each(function () {
				obj[$(this).attr('name')] = $(this).val();
			})
			table.bootstrapTable('updateRow', {index: rowIndex, row: obj});
			var row = table.bootstrapTable('getData');
		})
	}

效果

大佬勿喷，欢迎提意见建议评论！！！！