将JSON发送到网格

Question

I'm trying to send json data to a grid extjs, however i'm failing to connect to the grid.Besides the url what seems to be wrong in my grid code...Any ideas?The grid is displaying but is the syntax correct.I know the url is missing, but when i add it, the data isn't extracted to the grid.

public class JsonForm extends HttpServlet {

    public void doGet(HttpServletRequest request, HttpServletResponse response)
        throws IOException, ServletException
    {
         response.setContentType("text/html");    

         PrintWriter out = response.getWriter();

        JSONObject myObject = new JSONObject();
        myObject.put("firstname","Mike");
        myObject.put("lastname","J");
        myObject.put("email","j@mail.com");
        out.println(myObject);

        JSONObject myRecord = new JSONObject();
        myRecord.put("firstname","Mike");
        myRecord.put("lastname","J");
        myRecord.put("email","j@mail.com");

        JSONArray myRecords = new JSONArray();
        myRecords.add(myRecord);

    }   

}



//grid

Ext.onReady(function(){
    Ext.define('myRecord',{
        extend: 'Ext.data.Model',
        proxy: {
            type: 'memory',
            reader: 'json'
        },
        fields: [
            // set up the fields mapping into the xml doc
            // The first needs mapping, the others are very basic
            'firstName','lastName', 'email'
        ]
    });


    var gridStore = Ext.create('Ext.data.JsonReader', {

      autoLoad: true,
      proxy: {
          // load using HTTP
          type: 'ajax',
          url: '',
          // the return will be XML, so lets set up a reader
          reader: {
              type: 'json',
              // records will have an "Item" tag
              root: 'myRecord'

          }
       }
   });


    grid = Ext.create('Ext.grid.Panel', { 
      store: gridStore,
//    selModel: sm,
      columnLines: true,
      frame: true,
      columns: [
          {text: "First Name", flex:1, dataIndex: 'firstName', tdCls: 'no-dirty'},
          {text: "Last Name", flex:1, dataIndex: 'lastName', tdCls: 'no-dirty'},
          {text: "Email", flex:1, dataIndex: 'email', tdCls: 'no-dirty',}

      ],
      renderTo:Ext.getBody(),
      width: '100%',
      height: 650
    });

});

Answer 1

The gridStore should be the instance of Ext.data.Store. Url - should be proper url to your servlet. Store should contain model: 'myRecord'. Root property is set to 'myRecord', but as I can see you don't have root property at all.

Answer 2

Is your servlet code executed? If it is, take a look to the response you receive from your servlet. Probably json response is not correctly formed.