Ext Js (Sencha )
Ext JS is a cross-browser JavaScript library for building rich internet applications. Build rich, sustainable web applications faster than ever
Ext JS is a cross-browser JavaScript library for building rich internet applications. Build rich, sustainable web applications faster than ever
- High performance, customizable UI widgets
- Well designed and extensible Component model
- An intuitive, easy to use API
- Ext JS Home Page ( http://www.sencha.com/products/js/)
Struts 1.3
Struts is a flexible control layer based on standard technologies like Java Servlets, JavaBeans, ResourceBundles, and XML, as well as various Apache Commons packages, like BeanUtils and Chain of Responsibility. The framework helps you create an extensible development environment for your application, based on published standards and proven design patterns.
Struts is a flexible control layer based on standard technologies like Java Servlets, JavaBeans, ResourceBundles, and XML, as well as various Apache Commons packages, like BeanUtils and Chain of Responsibility. The framework helps you create an extensible development environment for your application, based on published standards and proven design patterns.
/* @vishnu.sankar *
* san.vishnu@gmail.com
*/
Ext.onReady(function(){
Ext.QuickTips.init();
var result;
var someFn=function(response,options){
result = Ext.util.JSON.decode(response.responseText);
this.tree = new Ext.tree.TreePanel({
useArrows: true,
autoScroll: true,
animate: true,
rootVisible : false,
containerScroll: true,
border: false,
root:{
text:'text',
id:'id',
children:result.tree
}
});
new Ext.Viewport({
layout: 'border',
id:'hello-win',
title: 'Ext Layout Browser',
items: [{
xtype: 'box',
region: 'north',
applyTo: 'header',
height: 30
},{
region:'west',
border: true,
split:true,
margins: '2 0 5 5',
width: 275,
minSize: 100,
maxSize: 500,
items:[this.tree]
},
{
id: 'layout-browser',
region:'center',
border: true,
header:true,
title:'test',
split:true,
margins: '2 0 5 5',
items:[{text:'hello'}]
}
],
renderTo: Ext.getBody()
});
};
Ext.Ajax.request({
url: 'acube/initTree.do?dispatch=populateTree',
success:someFn ,
failure: this.otherFn,
headers: {
'my-header': 'foo'
},
params: { foo: 'bar' }
});
});
}
The copy the above JS in a JS file say layout.js and copy the resource location in an HTML or JSP page
Struts code will look like this u can hook up the struts action from the clinet request
*/
/**
* @author vishnu.sankar
*
*/
public class AcubeAction extends DispatchAction{
private ConnectionManager conManager = null;
@SuppressWarnings("null")
public ActionForward populateTree(ActionMapping mapping, ActionForm form, HttpServletRequest request, HttpServletResponse response) throws Exception {
JSONObject jObject = new JSONObject();
HttpSession session = request.getSession();
try {
HashMap<string, object=""> responseMap = new HashMap<string, object="">();
jObject.put("tree", responseMap);
//responseMap : put you value with Key and Value in HashMap
}catch(Exception e){
}
JSONResponseWriterUtils.writeJSON(jObject, "tree", response);
return null;
}
</string,></string,>
and for writing the JSON in stream, use JSON API. Please see the modified class file
public final class JSONResponseWriterUtils {
public static void writeJSON(String jsonString,HttpServletResponse response) throws IOException {
response.setContentType("text/xml;charset=UTF-8");
StringBuffer buf = new StringBuffer();
buf.append(jsonString);
response.setContentLength(jsonString.getBytes().length);
response.setCharacterEncoding("UTF-8");
PrintWriter pw = response.getWriter();
pw.write(buf.toString());
pw.flush();
}
public static void writeJSON(JSONObject json, String jsonKey,HttpServletResponse response) throws IOException{
writeJSON(json.getString(jsonKey),response);
}
}
and in struts Action do like this
<action-mappings>
<action path="/Welcome" forward="/welcomeStruts.jsp">
<action path="/acube/*" type="com.acube.AcubeAction" validate="false" scope="request" parameter="dispatch">
</action>
</action></action-mappings>
Now we are
done . Integrated STRUTS-EXTJS ! Try this!
0 comments:
Post a Comment