码迷,mamicode.com
首页 > Web开发 > 详细

Ext 再grid的renderer中使用ajax访问服务器

时间:2018-10-08 16:38:10      阅读:189      评论:0      收藏:0      [点我收藏+]

标签:cat   nbsp   年度   action   渲染   var   单元格   服务   decode   

ps:在renderer中使用ajax访问服务器,并不是一个很好的方法因为会徒增大量的页面负载,个人建议是将数据在后台处理好后,封装到store中。

以下是在renderer中利用ajax渲染表格内容的代码:

 //定义列模式
 var colunms=[
        { header: ‘项目名称‘,		align: ‘left‘,		dataIndex : ‘xm_name‘,	flex: 1,	sortable: false},
        { header: ‘项目类型‘,		align: ‘left‘,		dataIndex : ‘itemType‘,	flex: 1,	sortable: false,renderer:function(value){
        	return getDicNameByDicId(value);
        }},
        { header: ‘项目类别‘,		align: ‘left‘,		dataIndex : ‘itemCategory‘,	flex: 1,	sortable: false,renderer:function(value){
        	return getDicNameByDicId(value);
        }},
        { header: ‘重要程度‘,		align: ‘left‘,		dataIndex : ‘importantDegree‘,     flex: 1,	sortable: false,renderer:function(value){
        	return getDicNameByDicId(value);
        }},
        { header: ‘申报年度‘,		align: ‘left‘,		dataIndex : ‘inputYear‘,     flex: 1,	sortable: false},
        { header: ‘实施年度‘,		align: ‘left‘,		dataIndex : ‘forYear‘,     flex: 1,	sortable: false},
        { header: ‘项目年度‘,		align: ‘left‘,		dataIndex : ‘theyear‘,     flex: 1,	sortable: false}
        
        ];

 渲染的方法。这里的需求是根据单元格的id值从数据库获取对应的name。

    function getDicNameByDicId(datas){
        var name ="";
        Ext.Ajax.request({
            url: contextPath + "/FtProjectAction!getDicNameByDicId.action",
            params: {datas:datas},
            async:false,
            success: function (response, opts) {
                var jsonData=    Ext.JSON.decode(response.responseText);
                name=jsonData.msg;
            },
            failure: function (response, opts) {
                
            }
        });
        return  name;
    }
  async:false是必须设置的 不然浏览器在返回值之前已经渲染了页面。导致单元格内容不显示。
async 设置为 false,则所有的请求均为同步请求,在没有返回值之前,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行。

 

Ext 再grid的renderer中使用ajax访问服务器

标签:cat   nbsp   年度   action   渲染   var   单元格   服务   decode   

原文地址:https://www.cnblogs.com/easyunion/p/9755045.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!