功能优点:减少不必要的http请求,减少服务器查询压力,降低额外的浏览器渲染,提高呈现速度
开发分享: combogrid 点击才请求的功能实现
简要:我分析了费用系统,和现在全网的写法.并不满意.都是要么全部请求,要么部分请求.
费用系统中是发起了请求,然后报404错误(伪地址的方式实现的)这种带来的缺陷是依旧发起了http请求,在
页面中大量存在combogrid的话就会问题突出.
因此在新的mcp2.0中我们尝试着首次加载10个,但这10条数据并不一定有意义,也就意味着还是浪费了带宽.
在对比全网分析下,依旧没有好的方案.找到官方demo一个一个查看分析.最后得出如下思路.
1.url初始化为空,直接不请求
2.在点击下拉时候再去请求
3.键入空格之后再起请求.简言之就是按需加载,多余走开.
onShowPanel: 是核心部分改造.
以下是代码
$(‘#divorder‘).find(‘#CustomerID‘).combogrid({
panelWidth: 400,
idField: ‘PartnerID‘,
mode: ‘remote‘,
textField: ‘PartnerNameCN‘,
method: ‘get‘,
url:‘‘,
fitColumns: true,
columns: [[
{ title: ‘ID‘, field: ‘PartnerID‘, hidden: true },
{ title: ‘中文名称‘, field: ‘PartnerNameCN‘, align: ‘left‘, width: 300 },
{ title: ‘业务伙伴代码‘, field: ‘PartnerCode‘, width: 100, align: ‘left‘ },
{ title: ‘联系人‘, field: ‘ContactPerson‘, align: ‘left‘, hidden: true },
{ title: ‘电话‘, field: ‘Tel‘, align: ‘left‘, hidden: true },
{ title: ‘地址‘, field: ‘Address‘, align: ‘left‘, hidden: true },
]], onShowPanel: function () {
$(‘#CustomerID‘).combogrid(‘grid‘).datagrid(‘options‘).url = ‘/Master/Partner/GetPartnerListForCombox?keyValue =‘+"";
$(‘#CustomerID‘).combogrid(‘grid‘).datagrid(‘reload‘);
},
});
以上是我的分享,关键是思路.代码非常简单.希望大家在新的项目中使用此方法.感谢!