extjs and Json

[maren]

hi,
I am looking for your help
I face a problem in joining the EXTJS and java with JSON
note down that i am employing the servlet
I would appreciate a prompt response from you

[mjlecomte]

www.json.org ?

[Corso]

Server to Client

var elemt = Ext.util.JSON.encode('your Object')


Cient to Server

JSONObject jsonObject = new JSONObject('elemt')

[nicovb]

1. Make an object like blablaData
2. send it to the servlet like this: .....blabla:Ext.util.JSON.encode(blablaData)...
3. in the servlet: JSONObject materialObject = new JSONObject(request.getParameter("blabla"));

[maren]

Thanks for your answer, but I want to send data from the servlet to a js page for reason to display it in a grid panel.
this is my source code:
file MyServlet.java:

import javax.servlet.http.HttpServlet;

import java.io.*;
import java.sql.*;
//import java.text.*;
//import java.util.*;
import javax.servlet.*;
import javax.servlet.http.*;
import net.sf.json.*;

@SuppressWarnings("serial")
public class ClieentServlet extends HttpServlet {
........................
public void doGet(HttpServletRequest request, HttpServletResponse response)
        throws IOException, ServletException
    {
//Create a JSONObject:
JSONObject myObject = new JSONObject();

//Put data in this Object
myObject.put("firstname","Jeans");
        myObject.put("lastname","Louis");
        myObject.put("job","developper");
        out.println(myObject);
}
}

in the browser I have this result:

{"firstname":"Jeans","lastname":"Louis","job":"developper"}

Now I would recover this data and put it in a gridPanel using Extjs, I have write this js code:

        Ext.onReady(function(){
            
        var store = new Ext.data.Store({
       
        reader : reader,
        autoLoad : true,
        remoteSort : true,
        proxy : new Ext.data.HttpProxy({
            
        url : 'http://localhost:8081/jsonJSPExtjs/clientinfo',
              })
        });
            
        var emp = Ext.data.Record.create([
        { name: 'firstname'}, { name: 'lastname'}, { name: 'job'}
        ]);
        
        var reader = new Ext.data.JsonReader({
        root : "myObject", 
        }, emp);
    
        
var grid1 = new Ext.grid.GridPanel({
        store: store,
        cm: new Ext.grid.ColumnModel([
        {header : "Name", width: 8, dataIndex : 'firstname'},
        {header: "LastName, width: 10, dataIndex: 'lastname'},
        {header: "Job", width: 10, dataIndex: 'job'}
        ]),
        viewConfig: {
        forceFit:true
        },
        width: 600,
        height: 300,
        collapsible: true,
        animCollapse: false,
        title: 'EmployeeInformation',
        iconCls: 'icon-grid',
        renderTo: document.body
        });
    
        store.load();
        
        
        
});

But in the results of this, I obtain an empty grid??
Thanks for help

[nicovb]

Try using Ext.data.JsonStore instead

[Condor]

Actually, to match your reader you would need:

JSONObject myRecord = new JSONObject();
myRecord.put("firstname","Jeans");
myRecord.put("lastname","Louis");
myRecord.put("job","developper");

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

JSONObject myObject = new JSONObject();
myObject.put("myObject",myRecords);

out.println(myObject);

But I would use:

JSONObject myRecord = new JSONObject();
myRecord.put("firstname","Jeans");
myRecord.put("lastname","Louis");
myRecord.put("job","developper");

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

out.println(myRecords);

and remove the root from the JsonReader.

[maren]

Try using Ext.data.JsonStore instead

I try it but I obtain the same result: empty grid!!
Please let me know the format of data in the jsp file.

[maren]

Actually, to match your reader you would need:

JSONObject myRecord = new JSONObject();
myRecord.put("firstname","Jeans");
myRecord.put("lastname","Louis");
myRecord.put("job","developper");

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

JSONObject myObject = new JSONObject();
myObject.put("myObject",myRecords);

out.println(myObject);

But I would use:

JSONObject myRecord = new JSONObject();
myRecord.put("firstname","Jeans");
myRecord.put("lastname","Louis");
myRecord.put("job","developper");

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

out.println(myRecords);

and remove the root from the JsonReader.

Thanks for your reply, I change my code,
but when I execute the servlet, I have this result on the browser:

{"myObject":[{"firstname":"Jeans","lastname":"Louis","job":"developper"}]}

what that means??
I have also the grid emty!!

[Condor]

1. Define your reader and record before you create the store.
2. You use autoLoad:true AND load() the store (one is enough).
3. You use url:'http://localhost:8081/jsonJSPExtjs/clientinfo'. Is your HTML also located on http://localhost:8081 (XSS restriction) ?
4. If you still can't get it to load, try if the loadexception event is fired on the store.