2016/09/28 15:22

昨天和今天，由于工作问题，暂停了websocket的学习，研究了一下，datatables的行内编辑，
先加入插件
数据源 {[“F1”:”33”,”F2”:”22”,”F3”:”22”,”F4”:”22”]}格式和这个一样

 tables.Table1=$('#Table1').DataTable( {
      data: arry,
      searching: false,
      ordering:  false,
      paging: false,
      info: false,
      scrollY:"450px", 
      scrollX:true,     
      scrollCollapse: true,  
      /*deferRender:true,
      scroller:true,*/
      "createdRow":function( row, data, dataIndex ) {
        // $(row).id="row_"+dataIndex;

         data.DT_RowId="row_"+dataIndex;
          data.f44="0000";
        console.log($(row));
         console.log(data)
      },   
      language: {
        emptyTable: "データは0件でした。"
      },      
      dom: "<'table-scrollable't>",

      columns: [
          { "data": 'F1',className:"colfa0"},
          { "data": 'F2',className:"colfa1"},
          { "data": 'F3'},
          { "data": 'F4',className:"center-align"},
          { "data": 'F5',className:"center-align"},
          { "data": 'F6',className:"center-align"},
          {  "render":function(data,type,row){
            return 0000;
          },editField: "f44"}
      ],  
      initComplete: function( settings, json ) {
          $.each([0,1],function(i,v){
              var n = 0
                  ,linetd=$(".colfa"+i);
              if(linetd.length>0){      
                //去重
                for (var i = 1; i <= linetd.length; i++) {
                    var str = "";
                    if (i == linetd.length) {
                        str = "";
                    } else {
                        str = linetd[i].innerText;
                    }
                    if (i > 0 && str == linetd[i - 1].innerText) {

                        n++;
                    } else {
                        for (var j = 0; j < n; j++) {
                            linetd[i - j - 1].innerText = "";
                        }
                        n = 0;
                    }
                }
              }                
          });
      }               

  }); 

加入之后做一些基本配置

 $('#Table1').on( 'click', '.colfa0', function (e) {
 console.log($(this)[0]._DT_CellIndex);
 canshu=$(this)[0]._DT_CellIndex.row;
 console.log(canshu);
  editor = new $.fn.dataTable.Editor( {
        table: "#Table1",
        ajax: {
            url:'./Handlers/ReWrite.ashx',
            data: {
                "user_id": 10108701,
                "canshu":canshu
            }
        },
        fields: [ {
                name: "F1"
            }, {

                name: "F2"
            }, {

                name: "F3"
            }, {

                name: "F4"
            }, {

                name: "F5"
            }, {

                name: "F6"
            },{
               name:"f44"
            }
        ]
    } );
         editor.inline( $(this),{
            onBlur: 'submit',
            submit: 'allIfChanged'
        } );
    } );

后台c#

public void ProcessRequest(HttpContext context)
        {
            HttpRequest request = context.Request;
            HttpResponse response = context.Response;
            String[] param = new String[10];
            param[0] = request["canshu"];
            param[1] = request["user_id"];
            param[2] = request["data[row_" + param[0] + "][F1]"];
            param[3] = request["data[row_" + param[0] + "][F2]"];
            param[4] = request["data[row_" + param[0] + "][F3]"];
            param[5] = request["data[row_" + param[0] + "][F4]"];
            param[6] = request["data[row_" + param[0] + "][F5]"];
            param[7] = request["data[row_" + param[0] + "][F6]"];
            StringBuilder sh = new StringBuilder();
            sh.Append("{\"data\":[{");
            sh.Append("\"DT_RowId\":\"row_" + param[0] + "\",\"F1\":\"" + param[2] + "\",\"F2\":\"" + param[3] + "\",\"F3\":\"" + param[4] + "\",\"F4\":\"" + param[5] + "\",\"F5\":\"" + param[6] + "\",\"F6\":\"" + param[7] + "\"}]}");
            response.ContentType = "application/json;charset=utf-8";
            response.ContentEncoding = Encoding.UTF8;
            response.Write(sh);
        }