From Learn About the Ext JavaScript Library

Contents 1 Reason to create this tutorial 2 Missing some source code 3 Most of code are posted 4 Re: Most of code are posted 5 json_cn.js and some suggestion 6 Problem solved 7 Trouble with JSON package 8 Where is the post/get url on create update and delte?

Reason to create this tutorial

I just spent one whole week to dig through list, search, CRUD, paging stuff. Finally it is done and I think it worth to post in here to share for all of us. Just in case it can save your some time. ENJOY.

Fenqiang Zhuang

Missing some source code

Thanks a lot! Your tutorial save my time on client side. Thanks.

But Your attached source does not have Java server code. Can You attach this code too? I mean Account, AccountUtil, AccountService, DateUtil, JsonMVCUtil, JsonUtil, ActionForward classes, and listAccount.do servlet. It is possible?

Thank You. Jaroslav Javorsky

Most of code are posted

Hi, Jaroslav Javorsky:

All of the important code (include Java code) are posted in the article. You can look through again to get some idea. The main reason that I did not post all of the Java code is that we are more focus on the client side. Java Code are just try to create JSON data, you can use Java, PHP, C# etc to create it. Here, I just give your an idea to create it. And this will make example simple and clean and easy to understand.

Regards!

Fenqiang Zhuang

Re: Most of code are posted

Thanks for quickly answer. I understand.

But: I made jsp page user.jsp

 <%@page contentType="text/html; charset=UTF-8"%>
 <%@page import="org.json.simple.JSONObject"%>
 <%
   JSONObject obj=new JSONObject();
   obj.put("id",1);
   obj.put("username","jaja");
   obj.put("enterDate","Jun 15, 2007");
   obj.put("firstname","Jaroslav");
   obj.put("passsword","Jaroslav");
   obj.put("lastname","Javorsky");
   out.print("({\"totalCount\":1,\"results\":["+obj+"]})");
   out.flush();
 %>

result is:

({"totalCount":1,"results":[{"lastname":"Javorsky","passsword":"Jaroslav","firstname":"Jaroslav","enterDate":"Jun 15, 2007","username":"jaja","id":1}]})

I replace in handleAccountAction.js

ScriptTagProxy URL: /yuiExt/listAccount.do with my new datasource:

       proxy: new Ext.data.ScriptTagProxy({
           url: 'http://17.17.17.2:8988/javorsky/json/test.jsp'
       }),

But no data display on my grid. What I'm doing wrong?

Isn't something important in /yuiExt/javascript/others/json_cn.js script file? Because in your listAccount.jsp you link it but and don't have this file.

Regards,

Jaroslav Javorsky

json_cn.js and some suggestion

json_cn.js is a open source which is used to create JSON data in client side. In here, a bunch of delete id is selected and use it to create JSON data. See: doDel() function. And this data is sent to server. Sorry to miss this lib. I will append it soon.

For you code, you need set the ContentType as application/x-json type. Otherwise it will not work. Please see example code in tutorial.

public static void jsonResponse(JSONObject jsonData, HttpServletRequest request, HttpServletResponse response) throws Exception { ..... }

Problem solved

I use

  proxy: new Ext.data.HttpProxy

instead of

  proxy: new Ext.data.ScriptTagProxy

and my grid display my data correctly

Jaroslav Javorsky

Trouble with JSON package

I tried to build a jsp just like Javorsky but even after adding the json_simple.jar to my lib folder, I recieve:

org.apache.jasper.JasperException: Unable to compile class for JSP

Generated servlet error: Only a type can be imported. org.json.simple.JSONObject resolves to a package

An error occurred at line: 3 in the jsp file: /jsp/getColecciones.jsp Generated servlet error: JSONObject cannot be resolved to a type

This only happens in a jsp file. If I try to add the JSONObject to some action, seems it reconigzes well.

Regards

Where is the post/get url on create update and delte?

How i can submit my request to serverside ? Is there a target address?

Problem solved

var form_instance_update = new Ext.form.Form({

       labelAlign: 'right',
       url:'http://localhost/demo/action/saveAction.jsp'

});