easyui datagrid 加载两次请求，触发两次ajax 请求 问题

时间：2023-03-09 18:54:28
easyui datagrid 加载两次请求，触发两次ajax 请求 问题

datagrid初始化的时候请求两次URL

两种情况

1.

<table id="gridview" class="easyui-datagrid"></table>
$(function(){

  $("#gridview").datagrid({

   url:"getData.do",

   title:"列表",

   singleSelect:false,

   pagination:true,

   toolbar:"#toolbar",

   method:"get",

    columns:[[

       {field:"ck",checkbox:true },

       {field:"id",title:"ID",width:20,sortable:true },

       {field:"kindName",title:"名称",width:100,resizable:true,sortable:true},

       {field:"createDate",title:"创建日期",width:80,resizable:true,sortable:true}

    ]]

  });

 })

由于在grid的table中写了class="easyui-datagrid"，另外在初始化的js中有了URL这样就会请求两次getData.do了，将class="easyui-datagrid"去掉即可。

第二种情况 ：

　　　　

初始化一个表格 
$(function(){
　　$('.SFC7450_main_table1').datagrid({

		url:'table.json',//加载本地json

		rownumbers:true,//序号是否显示

		pagination:true,	//是否添加页签

		pagePosition:'bottom',	//页面的位置

		method:'get',//获取类型

		singleSelect:true,//是否单选

		fitColumns:false,//单元格是否自适应填满表格宽度

		columns:[SFC7450_table[0]]

	});

});

使用下面方式为表格赋值 
$('.SFC7450_main_table1').datagrid({

		url:'/sfc/a.do',//加载本地json

		rownumbers:true,//序号是否显示

		pagination:true,	//是否添加页签

		pagePosition:'bottom',	//页面的位置

		method:'get',//获取类型

		singleSelect:true,//是否单选

		fitColumns:false,//单元格是否自适应填满表格宽度

		columns:[SFC7450_table[0]]

	});
这时候会出现一个奇怪的现象： js调试观察network 会看到 请求了 sfc/a.do .. 请求完成后又请求了一次 table.json ... 解决：可以在初始化的时候不要请求url，而是使用data 赋一个空数组 （我们为什么要初始化一个空的表格，是为了页面在初始的时候展现好看）
//空白JOSN 5行

var KongJson5=[

{"":"","":"","":"","":"","":"",

"":"","":"","":"","":"","":""},

{"":"","":"","":"","":"","":"",

"":"","":"","":"","":"","":""},

{"":"","":"","":"","":"","":"",

"":"","":"","":"","":"","":""},

{"":"","":"","":"","":"","":"",

"":"","":"","":"","":"","":""},

{"":"","":"","":"","":"","":"",

"":"","":"","":"","":"","":""}

]

改成下面即可 $('.SFC7450_main_table1').datagrid({
		data:KongJson5,//加载本地json
		rownumbers:true,//序号是否显示

		pagination:true,	//是否添加页签

		pagePosition:'bottom',	//页面的位置

		method:'get',//获取类型

		singleSelect:true,//是否单选

		fitColumns:false,//单元格是否自适应填满表格宽度

		columns:[SFC7450_table[0]]

	});

　　

<table id="gridview" class="easyui-datagrid"></table>

相关文章