EasyUi datagrid 动态生成表头

Posted 2020-08-21 帆疯子

从后台到显示

表头显示数据

/**
 * 服务器账单明细
 * @author Administrator
 *
 */
public class ServerBillingDetailInfo implements Serializable{
    /**
     * 
     */
    private static final long serialVersionUID = 6802412713642265144L;
    private Long id;//服务器账单id
    private String bussinessNum;//服务器账单os账号
    private String ip;//服务器账单服务器Ip
    public ServerBillingDetailInfo() {
        super();
        // TODO Auto-generated constructor stub
    }
    public ServerBillingDetailInfo(Long id, String bussinessNum, String ip) {
        super();
        this.id = id;
        this.bussinessNum = bussinessNum;
        this.ip = ip;
    }
    public Long getId() {
        return id;
    }
    public void setId(Long id) {
        this.id = id;
    }
    public String getBussinessNum() {
        return bussinessNum;
    }
    public void setBussinessNum(String bussinessNum) {
        this.bussinessNum = bussinessNum;
    }
    public String getIp() {
        return ip;
    }
    public void setIp(String ip) {
        this.ip = ip;
    }
    @Override
    public String toString() {
        return "ServerBillingDetailInfo [id=" + id + ", bussinessNum="
                + bussinessNum + ", ip=" + ip + "]";
    }
    
}

表头类：

public class Header{
    private String field;
    private String title;
    private int width=150;
    public ServiceDto() {
        super();
        // TODO Auto-generated constructor stub
    }
    public Header(String field, String title, int width) {
        super();
        this.field = field;
        this.title = title;
        this.width = width;
    }
    public String getField() {
        return field;
    }
    public void setField(String field) {
        this.field = field;
    }
    public String getTitle() {
        return title;
    }
    public void setTitle(String title) {
        this.title = title;
    }
    public int getWidth() {
        return width;
    }
    public void setWidth(int width) {
        this.width = width;
    }
    @Override
    public String toString() {
        return "AccountDto [field:" + field + ", title:" + title + ", width:"
                + width + "]";
    }
    
}

controller:

//组装表头
@RequestMapping(value = "/getIP", method = RequestMethod.GET)
    public @ResponseBody
    List<?> getBillingDetailInfosAllIP(HttpServletRequest req) {
　　　　　List<Header> ths = new ArrayList<Header>();
        Header header1= new Header();
        header1.setField("date");
        header1.setTitle("时间");
        ths.add(header1);
        for (int i = 0; i < list.size(); i++) {
            Header header = new Header();
            header.setField(list.get(i).getIp());
            header.setTitle(list.get(i).getBussinessNum());
            ths.add(header);
        }
        return ths;
    }

js：

$.ajax({
        url : "AccountWYF/getIP",
        // data:json,
        // contentType:"application/json",
        success : function(data) {
            writeObj(data)
        }
    });

    function writeObj(data) {
        $(‘#billingWindow‘).datagrid({
            url : ‘AccountWYF/getMonthAll‘,
            method : ‘get‘,
            title : ‘账务查询‘,
            columns : [ data ],
            queryParams : params(),
            pagination : true,
            pageSize : 5,
            pageList : [ 5, 10, 15 ]

        });
    }

jsp：

<div data-options="region:‘center‘,border:true,split:true"
        style="padding:5px;background:#eee;">
        <table id="billingWindow" class="easyui-datagrid" style="width:98%">
        
        
        
        </table>
        </div>

完成