A routine mode of extjs + struts2

In fact, in the combination of struts2 and extjs, We can summarize some excellent routine modes, such as in struts2.

How to display the returned data in extjs on the front end can be sorted in the following way:

For example, a struts2 action returns a list of photos in the album, such

<Action name = "getphotos"

Class = "getphotosaction">

<Result name = "success">/WEB-INF/photos. jsp

</Result>

</Action>

In photos. jsp, you can do this:

<% @ Page Language = "Java" contenttype = "text/html; charset = UTF-8"

Pageencoding = "UTF-8" %>

<% @ Taglib prefix = "S" uri = "/Struts-tags" %>

[

<S: iterator id = "photo" value = "Photos" status = "status">

{ID: '<s: property value = "# photo. ID "/> ', name:' <s: property value =" # photo. filename "/> ', filename:' <s: Property

Value = "# photo. filename "/> ', userid:' <s: property value =" # photo. userid "/> ', albumid:' <s: property value =" # photo. albumid "/> '}

<S: If test = "# status. Last = false">

,

</S: If>

</S: iterator>

]

It is used for struts2 + extjs nesting. It will actually generate:

[{ID:..., name:, },{ ID: 333,... Name: XXXX}] JSON format data

In ext JS components, you can use the following:

Function getimagedataview ()

{

Imagedataview = new Ext. dataview (

{

Itemselector: 'div. Thumb-wrap ',

Style: 'overflow: auto ',

Multiselect: True,

ID: 'imagedataview ',

Store: getphotosjsonstore (),

TPL: New Ext. xtemplate (

'<TPL for = "."> ',

'<Div class = "Thumb-wrap" id = "{name}"> ',

'<Div class = "Thumb"> </div> ',

'<Span> </div>', '</TPL> ')

});

Store: getphotosjsonstore (),

This is the thing:

Function getphotosjsonstore ()

{

Return new Ext. Data. jsonstore ({

URL: 'getphotos. Action? Albumid = '+ albumid,

Autoload: True,

ID: 'name ',

Fields: ['id', 'name', 'filename', 'albumid']

})

}

You can see the JSON format returned by the server. In Ext, {filename} can be nested into extjs.