如何发送跨域请求加载Grid Ext JS 4.1

时间:2012-08-19 10:00:59

标签: extjs grid jsonp extjs4.1

如何将数据加载到使用AJAX向ws发送跨域请求的网格中?我能够发送请求但是如何使用回调方法将数据加载到网格中?

在控制器文件中:

if(searchText){
    var resultGrid = Ext.getCmp('myResultGrid');
    store.setProxy({
                            type: 'ajax',
                            // cross domain request
                            url:"http://3.xxx.xxx.77/cs/sid/"+searchText,
                            actionMethods:{read:'GET'},
                            pageParam: false, //to remove param "page"
                            startParam: false, //to remove param "start"
                            limitParam: false,
                            timeout:9000000,
                            noCache : true,
                            reader: {
                            type: 'json'
                            }
                    });


    resultGrid.store.load({
      scope: this,
      callback: function(records, operation, success) 
      {
          var totalcount= 0;
          totalcount = records.count(true);

          if(totalcount > 0)
          {
              // Load the data into grid ???

          }
          else
          {
              Ext.Msg.alert("No Records found.");   
          }
      }
    });
}

商店文件: SearchResultsStore.js

     Ext.define('AM.store.SearchResultsStore', {
    extend: 'Ext.data.Store',
    model: 'AM.model.SearchModel',
    autoLoad: false
});

型号:

   Ext.define('AM.model.SearchModel', {
    extend: 'Ext.data.Model',
    fields: ['slno', 'customer']
});

json回应

        [{"slno": "12454","customer": "acd"}]

请帮助我被困!提前致谢

1 个答案:

答案 0 :(得分:1)

您无法使用ajax跨域发送请求,这是此处的实际问题。您假设您必须在加载回调中执行某些操作,因为您首先没有收到数据,这与您的问题无关,您不需要使用回调。您需要做的是使用' jsonp'代理而不是ajax,它可以让您进行跨域调用:

store.setProxy({
                                type: 'jsonp',
                                // cross domain request
                                url:"http://3.xxx.xxx.77/cs/sid/"+searchText,
                                actionMethods:{read:'GET'},
                                pageParam: false, //to remove param "page"
                                startParam: false, //to remove param "start"
                                limitParam: false,
                                timeout:9000000,
                                noCache : true,
                                reader: {
                                type: 'json'
                                }
                        });