dataTable input可修改、select可选择列,操作中带上传文件

zlscTable = $('#lxzlTable').dataTable({
    destroy: true,
    serverSide: true,
    responsive: true,
    processing:true,
    autoWidth: true,//自动计算列宽
    deferRender: true,//设置延迟渲染,提高效率用
    draw:false,
    searching : false, 
    bLengthChange: false,
    order: [ 0, 'asc' ],
    ajax: {
        url: "sjxm2/getLxzlInfoData",
        type: "POST",
        data : function(d) {  
            var sentJson = GET_SENT_JSON(d);
            sentJson.search1 = sjxmglArr[0].xmfldm.split('/')[0];
            sentJson.search2 = sjxmglArr[0].sjxmdm;
            return sentJson;
        },
        error: function (e) {
            ALERT_ERROR(zlscTable,e);
        },
    },
    lengthMenu: PAGELENGTH,
    "language": LANGUAGESETTING,
    columnDefs : [
        { "targets": 0 ,"name":"wdlx","title": "文档类型" ,"width": "10%" },
        { "targets": 1 ,"name":"wdmc","title": "文档名称" ,"width": "15%" },
        { "targets": 2 ,"name":"fj","title": "附件名(点击下载)" ,"width": "15%" },
        { "targets": 3 ,"name":"isby","title": "必要否" ,"width": "6%" ,orderable :false},
        { "targets": 4 ,"name":"is_zlsc","title": "资料生成" ,"width": "6%" ,orderable :false},
        { "targets": 5, "name":"lxzl_type", "title": "立项资料", "visible" : true, "width" : "15%", orderable : false },
        { "targets": 6 ,"name":"edit","title": "操作" ,"visible": true,"width": "20%"  ,orderable :false},
        { "targets": 7 ,"name":"wdbh","title": "文档编号" ,"visible": false,"width": "10%" , orderable :false ,},
        {
            "render": function ( data, type, row ) {
                var file = data.split(",");
                var result="";
                for(var i=0; i<file.length; i++){
                    //checkbox形式
                    //result += "<input type='checkbox' value=' + file[i] + '/><span style=\"color:green\">"  + file[i] + "</span><br>";
                    result += "<a class='download' id ='file' href='javascript:;' >"  + file[i] + "</a><br>"
                }
                return result;
            },
            "targets": [2],
            "visible": true
        },  
        {
            "render": function ( data, type, row ) {
                var result = "";
                if(data == "1"){
                    result = "<span style=\"color:green\">"  + "是" + "</span>";
                }else{
                    result = "<span style=\"color:red\">" + "否" + "</span>";
                }
                return result;
            },
            "targets": [3],
            "visible": true
        },
        {
            "render": function ( data, type, row ) {
                var result = "";
                if(data == "1"){
                    result = "<span style=\"color:green\">"  + "是" + "</span>";
                }else{
                    result = "<span style=\"color:red\">" + "否" + "</span>";
                }
                return result;
            },
            "targets": [4],
            "visible": true
        },
    ],
    columns: [
        { data: 'wdlx' },
        { data: 'wdmc' },   
        {
            "sClass": "text-left",
            "data": "fj",
            "render": function (data, type, row, meta) {
                var result = "";
                var i = meta.row;
                
                result = "<input  id='input_lxzl" + i + "' class='form-control fj_input' value='" + data + "' style='border:0;width: 100%'>";
                
                return result;
            },
        },
        { data: 'isby' },
        { data: 'is_zlsc' },
        {
            "sClass": "text-center",
            "data": "lxzl_type",
            "render": function (data, type, row, meta) {
                var result = "";
                var i = meta.row;
                
                result = "<select selected id='sel_lxzl" + i + "' class='form-control' style='border:0;width: 100%'>";
                result += "<option value=''></option>";
                
                
                for(var i = 0; i < lxzl_list.length; i++){
                    if(data == lxzl_list[i].sybh){
                        result += "<option selected value='" + lxzl_list[i].sybh + "/" + lxzl_list[i].symc + "'> " + lxzl_list[i].symc + "</option>";
                    }
                }
                for(var i = 0; i < lxzl_list.length; i++){
                    if(data != lxzl_list[i].sybh){
                        result += "<option value='" + lxzl_list[i].sybh + "/" + lxzl_list[i].symc + "'> " + lxzl_list[i].symc + "</option>";
                    }
                }
                result += "</select>";
                return result;
            },
        },
        //带下载
        { data: null  ,defaultContent: "<button class='btn btn-primary upload' href='javascript:;'>上传</button>&nbsp;&nbsp;<button class='btn btn-primary' id='deletefj' href='javascript:;'>删除</button>&nbsp;&nbsp;<button class='btn btn-primary photo' href='javascript:;'>拍照</button>&nbsp;&nbsp;<button class='btn btn-primary view_photo' href='javascript:;'>查看照片</button>" },
        { data: 'wdbh' },
    ]
});

$('#lxzlTable tbody tr').live('click', function() { 
});

//鼠标移动添加背景颜色
mouseEvent("lxzlTable");



$("table#lxzlTable").on("change", ".fj_input", function(){
    
    var jzszDataArr = [];
    var nRowmc = $(this).parents('tr')[0];
    var aDatamc = zlscTable.fnGetData(nRowmc);
    rowNummc = $(this).parents('tr')[0].rowIndex - 1;
    
    var msg = [];
    //文档类型代码检查
    if(aDatamc.fj == null  || aDatamc.fj == ""){
        msg.push("附件名不能为空!"+"</br>");
    }
    
    if(msg.length > 0){
        Metronic.alert({
            type : 'danger',
            icon : 'warning',
            message : msg.toString().replace(/,/g,'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'),
            place : 'prepend',
            closeInSeconds : 5,
            container : '#lxzlSXAlertsMsg',
            focus : true
        });
        return false;
    } else {
        var aData = 
        {
            wdlx : aDatamc.wdlx,
            wdmc : aDatamc.wdmc,
            sjxmdm : sjxmglArr[0].sjxmdm,
            fjmc : $('#input_lxzl' + rowNummc).val().split("/")[0]
        };
        
        $.ajax({
            type : "POST",
            url : "sjxm2/updateLxzl",
            dataType : "json",
            contentType : 'application/json', //定义格式
            data : JSON.stringify(aData),//把json转为String传递给后台
            error : function(data) {
                Metronic.alert({
                    type: 'danger',
                    icon: 'warning',
                    message: '更新失败!',
                    place: 'prepend',
                    closeInSeconds:5,
                    container:'#lxzlSXAlertsMsg',
                    focus:true
                });
            },
            success : function(data) {
                Metronic.alert({
                    type: 'success',
                    icon: 'success',
                    message: '更新成功!',
                    place: 'prepend',
                    closeInSeconds:5,
                    container:'#lxzlSXAlertsMsg',
                    focus:true
                });
                freshZlscTable();
                jzszDataArr = [];
            }
        });
        return false;
    }
});



$("table#lxzlTable").on("change", "select", function(){
    
    var jzszDataArr = [];
    var nRowmc = $(this).parents('tr')[0];
    var aDatamc = zlscTable.fnGetData(nRowmc);
    rowNummc = $(this).parents('tr')[0].rowIndex - 1;
    
    var msg = [];
    //文档类型代码检查
    if(aDatamc.wdlx == null  || aDatamc.wdlx == ""){
        msg.push("文档类型代码不能为空!"+"</br>");
    }
    //文档名称
    if(aDatamc.wdmc == null  || aDatamc.wdmc == ""){
        msg.push("文档名称不能为空!"+"</br>");
    }
    //立项资料
    if($('#sel_lxzl' + rowNummc).val() == null  || $('#sel_lxzl' + rowNummc).val() == ""){
        msg.push("立项资料不能为空!"+"</br>");
    }
    
    if(msg.length > 0){
        Metronic.alert({
            type : 'danger',
            icon : 'warning',
            message : msg.toString().replace(/,/g,'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'),
            place : 'prepend',
            closeInSeconds : 5,
            container : '#lxzlSXAlertsMsg',
            focus : true
        });
        return false;
    } else {
        var aData = 
        {
            wdlx : aDatamc.wdlx,
            wdmc : aDatamc.wdmc,
            sjxmdm : sjxmglArr[0].sjxmdm,
            lxzl : $('#sel_lxzl' + rowNummc).val().split("/")[0]
        };
        
        $.ajax({
            type : "POST",
            url : "sjxm2/updateLxzlType",
            dataType : "json",
            contentType : 'application/json', //定义格式
            data : JSON.stringify(aData),//把json转为String传递给后台
            error : function(data) {
                Metronic.alert({
                    type: 'danger',
                    icon: 'warning',
                    message: '更新失败!',
                    place: 'prepend',
                    closeInSeconds:5,
                    container:'#lxzlSXAlertsMsg',
                    focus:true
                });
            },
            success : function(data) {
                Metronic.alert({
                    type: 'success',
                    icon: 'success',
                    message: '更新成功!',
                    place: 'prepend',
                    closeInSeconds:5,
                    container:'#lxzlSXAlertsMsg',
                    focus:true
                });
                freshZlscTable();
                jzszDataArr = [];
            }
        });
        return false;
    }
    
    
    
});

$('#lxzlTable').on('click', '.photo', function (e) {
    var nRow = $(this).parents('tr')[0];
    var aData1 = zlscTable.fnGetData(nRow);
    
    $('#photo_sjxmdm').val(aData1.sjxmdm);
    $('#photo_wdmc').val(aData1.wdmc);
    $('#photo_wdlx').val(aData1.wdlx);
    
    
    $("#lxzlphoto").modal('show');
    document.getElementById('photo_button').click();
    return false;
});

//上传
$('#lxzlTable').on('click', '.upload', function (e) {
    uploadFiles();
    return false;
});

//查看拍照图片
$('#lxzlTable').on('click', '.view_photo', function(e) {
    
    var nRow = $(this).parents('tr')[0];
    var aData1 = zlscTable.fnGetData(nRow);
    
    var aData = {
        sjxmdm: aData1.sjxmdm, 
        wdlx: aData1.wdlx,
        wdmc: aData1.wdmc,
    };
    $("#showimg").empty();
    $.ajax({
        type : 'POST',
        url : "sjxm2/getViewPhoto",
        dataType : "json",
        contentType : 'application/json', //定义格式
        data : JSON.stringify(aData),
        success : function(data) {
            $("#lxzlviewphoto").modal('show');
            var begin_data="data:image/jpeg;base64,";
            var imgNum = data.length; //图片数量
              for(var i=0; i<imgNum; i++){
                var ss = "<div style='display:inline'><img class='img_photo min' style='margin-right:10px;margin-bottom: 10px;' src='"+begin_data+data[i].base64+"' width=150px></div>" 
                $("#showimg").append(ss);
                if((i+1) % 8 == 0){
                    $("#showimg").append("<br>");
                }
              }
              $('.img_photo').click(function(){//传入图片id时注意形式,前面一个#号
                    $(this).toggleClass('min');
                    $(this).toggleClass('max');
                })
        },
        error : function(data) {
                                        
        }
    });
});
    
//delete附件
$('#lxzlTable').on('click', '#deletefj', function(e) {
    
    var nRow = $(this).parents('tr')[0];
    var aData1 = zlscTable.fnGetData(nRow);
    
    var aData = {
        sjxmdm: aData1.sjxmdm, 
        zlk_bh: aData1.zlk_bh,
        lxzl: aData1.lxzl_type
    };
    
    $.ajax({
        type : 'POST',
        url : BASEPATH + "sjxm2/deletefj",
        dataType : "json",
        contentType : 'application/json', //定义格式
        data : JSON.stringify(aData),
        success : function(data) {
            freshZlscTable();
        },
        error : function(data) {
            console.log(JSON.stringify(aData));                         
        }
    });
});

$('#uploadFile').live("change","#fileName",function(){
    var file = $('#fileName')[0].files;
    var sjxm = sjxmglArr[0].sjxmdm;
    
    
    var aDatamc = zlscTable.fnGetData();
    var lxzl = aDatamc[0].lxzl_type;
    var fj = aDatamc[0].fj;
    // 构建form数据
    var formFile = new FormData;
    
    //把文件放入form对象中
    for(var i=0; i<file.length; i++){
        formFile.append("action", "UploadPath");
        formFile.append('file', file[i]);
    }
    formFile.append('sjxmdm', sjxm);
    formFile.append('lxzl', lxzl);
    formFile.append('fj', fj);
    var nRow = $(this).parents('tr')[0];
    var aData = zlscTable.fnGetData(nRow);
    
    $.ajax({
        type : 'POST',
        url : BASEPATH + "sjxm2/uploadFile",
        data : formFile,
        contentType : false, //定义格式
        processData : false, //必须要
        success : function(data) {
            if(data.message == 'success'){
                var fjList = [];
                var fj;
                for(var i=0; i<file.length; i++){
                    fjList.push(file[i].name)
                }
                fj = fjList.join(",");
                var paramData = {
                    sjxmdm : aData[0].sjxmdm,
                    wdmc : aData[0].wdmc,
                    lxzl : aData[0].lxzl_type,
                    fj : fj
                }
                $.ajax({
                    type : 'POST',
                    url : 'sjxm2/uploadFileName',
                    dataType : "json",
                    contentType : 'application/json', //定义格式
                    data : JSON.stringify(paramData),
                    async : false,
                    processData : false, //必须要
                    success : function(data) {
                        if(data.message == 'success'){
                            Metronic.alert({
                                type: 'success',
                                icon: 'success',
                                message: '资料上传成功!',
                                place: 'prepend',
                                closeInSeconds:5,
                                container:'#lxzlSXAlertsMsg',
                                focus:true
                            });
                            freshZlscTable();
                        } else {
                            Metronic.alert({
                                type: 'danger',
                                icon: 'warning',
                                message: "资料上传不成功!",
                                place: 'prepend',
                                closeInSeconds:5,
                                container:'#lxzlSXAlertsMsg',
                                focus:true
                            });
                        }
                    },
                    error : function(data) {
                        console.log(JSON.stringify(data))
                    }
                });
            } else {
                Metronic.alert({
                    type: 'danger',
                    icon: 'warning',
                    message : "文件上传失败",
                    place : 'prepend',
                    closeInSeconds : 5,
                    container : '#lxzlSXAlertsMsg',
                    focus : true
                });
            }
        },
        error : function(data) {
            console.log(JSON.stringify(data))
        }
    });
});



//文件上传
    function uploadFiles() {
        
        form = $("<form id= 'uploadFile' enctype='multipart/form-data' method='post'></form>");
        input1 = $("<input id='fileName' type='file' name='fileName' style = 'display:none' multiple />");
        form.append(input1);
        form.appendTo("body")

        $("#fileName").click();

        // 获取文件对象
//      var file = $('#fileName')[0].files;
//      if (!file || file.length === 0) {
//          alert('请先选择文件');
//          return false;
//      } else {
//          return file[0];
//      }
    };
上一篇:C# DataTable映射成Entity


下一篇:C#数据表(DataTable)转键值对集合