easyui的table如何动态添加行数据

需求是读取excel表头,动态的显示出来。。。。

 

html:

<td>模板上传:</td>
            <td class="text-left" style="width: 30%">
             <input type="file" class="form-control" data-required="1" name="file_name" id="fileName" value="" required="required">
             </td>

<table id="dg" class="easyui-datagrid" style="width:510px;height:250px" > </table> 

 

js:

$("#fileName").change(function(e){
  $.ajaxFileUpload({
  url: "***********",
  files: $(':file'),
  data: {},
  dataType: "json",
  contentType: 'text/json,charset=utf-8',
  success:function(data){
  if(data.length == 0){
  $('#file_examine').modal("show");
    $("#addTable").empty();
    alert("请检查读取的文件是否正确")
    return;
  }else{
    $('#dg').datagrid({
    columns:[[
      {field:'xh',
      title:' 序号 ',
      width:150,
    formatter: function(val,rec,index){
    return index + 1;
    }
  },{
    field:'name',
    title:'中文字段',
    width:200
  },{field:'isjm',
    title:'是否加密 ',
    width:100,

  },{
  checkbox:'true',
  field:'Encrypt',
    title:'是否加密',
  width:200
  }
  ]]
  });
  //easyui数据动态添加
  for(i=0;i<data.length;i++){
    $('#dg').datagrid('appendRow',{
    xh: 'new name',
    name: data[i],
    Encrypt: ''
  });
  }
  }
  },  
    error: function(data, status, e) {
      console.log("出现意外的错误")
  }
  });
})

posted @   liglacier  阅读(5172)  评论(0编辑  收藏  举报
编辑推荐:
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
阅读排行:
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
点击右上角即可分享
微信分享提示