2

I am calling rest web service from sencha extjs 4.2.1 in model .My model is

Ext.define('AM.model.User', {
    extend: 'Ext.data.Model',
    fields: [
    {name: 'subCategoryName',  type: 'string'},
    ],
    proxy:{
    type : 'jsonp',
    callbackKey: 'callback',

            url: 'http://192.168.1.10:8080/CredoCustomerConnect/subcategory/getsubcategorylist/1/1/0',
         headers: {
             'Accept': 'application/json'
         },
          callback: function( data ) {             
             console.log("callback" + data);        
    },
    listeners: {
               load: function() {   
                   console.log("in load");
                }
                   },

       reader: {
           type: 'json',
           rootProperty:'subcategory'
           }
        }

});

When I call the url 'http://192.168.1.10:8080/CredoCustomerConnect/subcategory/getsubcategorylist/1/1/0',

in the browser , I am getting the result like

callback({"listException":"false","listSize":"5","nextPage":"false","pageNumber":"0","subcategory":[{"isException":"false","categoryId":"1","categoryName":"Solutions","productSize":"4","subCategoryDescription":"Oracle Consulting","subCategoryId":"1","subCategoryName":"Oracle Consulting"},],"totalRecords":"5"})

But I am not seeing any data in grid view.

Rest Web service method is 

@GET
     @Path("getsubcategorylist/{categoryId}/{userId}/{pageNumber}")
     @Consumes("application/x-www-form-urlencoded")
     //@Produces({MediaType.APPLICATION_JSON})
     @Produces({"application/javascript"})
     public JSONWithPadding   getSubCategorylist(@PathParam("categoryId") int categoryId,@PathParam("userId")int userId,@PathParam("pageNumber") int pageNumber, @QueryParam("callback") String callback)
     {

         SubCategoryList subCategory = new SubCategoryList();
         SubCategoryEntityHandler handler = new SubCategoryEntityHandler();
         try {
             subCategory =  handler.getSubCategoriesList(categoryId,pageNumber);

             return new JSONWithPadding(
                        new GenericEntity<SubCategoryList>(subCategory) {
                        },callback);

        } catch (Exception e) {
            e.printStackTrace();
            subCategory.setListException(true);
            subCategory.setListMessage(e.getMessage());
                        return new JSONWithPadding(
                    new GenericEntity<SubCategoryList>(subCategory) {
                    }, "callback");
        }    
     }

My store is 

 Ext.define('AM.store.Users', {
        extend: 'Ext.data.Store',

        config: {
        model: 'AM.model.User',


        }
    });

My view is 

Ext.define('AM.view.user.List' ,{
    extend: 'Ext.grid.Panel',
    alias: 'widget.userlist',

    title: 'All Users',
    store: 'Users',

    initComponent: function() {


        this.columns = [
            {header: 'Subject',  dataIndex: 'subCategoryName',  flex: 1},

        ];

        this.callParent(arguments);
    }
});

There is no error in console. But I am not seeing any data in grid. How to resolve this?

4

2 回答 2

2

您的服务器不应简单地返回：

callback({...})

相反，它必须读取您配置为的请求 GET 参数的值callbackKey（在您的情况下，即“回调”），并将该值用作响应中回调的名称。请参阅JsonP 代理文档中的“在服务器端实现”部分。

例如，对于它的第一个请求，代理将使用如下 URL：

http://192.168.1.10:8080/CredoCustomerConnect/subcategory/getsubcategorylist/1/1/0?callback=Ext.data.JsonP.callback1

所以服务器响应必须是：

Ext.data.JsonP.callback1({ ... })

第二个请求 URL 类似于：

http://192.168.1.10:8080/CredoCustomerConnect/subcategory/getsubcategorylist/1/1/0?callback=Ext.data.JsonP.callback2

等等等等。

于 2013-06-05T13:03:37.927 回答
0

From Extjs docs:

JsonP proxy creates a temporary callback function, waits for it to be called and then puts the data into the Proxy making it look just like you loaded it through a normal AjaxProxy.

This code worked for me after a bit of tweaking around

Ext.define('My.Model', {
extend: 'Ext.data.Model',
fields: [
    'id', 'name'
],
proxy:{
    type : 'jsonp',
    url: 'http://127.0.0.1:8080',
    reader : {
        type : 'json',
        root : 'data'
    }
}

My.Model.load(1, {
                    callback: function(data) {
                    console.log(data);
                }
            });

Server side:

 // Retrieve the callback parameter
    cb = parms.get("callback");
    // Build response string
    msg = cb + "({ \"data\": [{\"id\": 1, \"name\": \"" + "username" + "\"}] });";
    //Return msg with status 200 OK and "text/javascript" header
于 2013-09-16T15:48:29.443 回答