JQuery Easyui Learning--struts2 displaying database data in conjunction with the Easyui DataGrid data table

Because the Easyui DataGrid can display data from a database in a certain form in the foreground page data table, as long as it takes out a certain format of JSON data that is sent back from the background. Here, we use the STRUTS2 framework to integrate the DataGrid for data display.

First, the content of the page

To display the contents of a field in a database in a page, you need to define a table that automatically displays the data through the Easyui internal design, as follows:

<%@ page language= "java" import= "java.util.*" pageencoding= "UTF-8"%><%@ taglib prefix= "s" uri= "/struts-tags" %><%string path = Request.getcontextpath (); String basepath = request.getscheme () + "://" +request.getservername () + ":" +request.getserverport () +path+ "/";%> <! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01 transitional//en" >
From the above, the Easyui data table can be generated by JS, looks relatively fresh, can also be used in the <tr><td></td></tr> mode, but it seems a bit messy. When the link button is clicked, the page automatically executes the corresponding action based on the action request address in the URL and returns the result .
Second, struts.xml in the configuration
<!--Show property information--      <action name= "showhouses" class= "Com.wy.action.HouseAction" method= "show" >         < Result type= "JSON" name= "Success" >           <param name= "root" >result</param>         </result>      </action>
Third, the corresponding action processing class
 private jsonobject result;             Returns the JSON private String rows;             The number of records displayed per page private String page;  Current page//Display property basic information public String Show () {//current page int intpage = integer.parseint (page = = NULL | | page = = "0") ?      "1":p age); Number of bars per page int numbers = Integer.parseint ((rows = NULL | | rows = = "0")?         "Ten": rows);         The beginning of each page is the first page of 1 The second page is number +1 int start = (intPage-1) *number;    Housedao housedao=new Housedao (); Arraylist<thouse> listhouses=housedao.gethouses (start, number); Querying data from the database map<string, object> jsonmap = new hashmap<string, object> ();//define MAP int count= Housedao.gethousecount ();            Find the total number of records//total key to store the total number of records, must be Jsonmap.put ("totals", count); Jsonmap.put ("Rows", listhouses),//rows key to each page record list result=jsonobject.fromobject (Commonutil.getjsonno                 Tnull (Jsonmap)); return SUCCESS;} 
In the action class, Rows,page is used for Easyui paging operations,Easyui automatically passes parameters to the background: the current page and the number of records displayed per page for paging, you only need to define these two variables here.
Iv. Easyui JSON data format
{"Total": 5, "Rows": [{"Doorcard": "1-1101", "id": $, "Roomarea": "" "," Unitnum ": 1," tusers ": []," Isuse ":" 1 "," Buildtime ":" 2015-04-01 "},{" Doorcard ":" 1-1202 "," id ":" Roomarea ":" "", "Unitnum": 1, "tusers": [], "Isuse": "0", " Buildtime ":" 2015-04-06 "},{" Doorcard ":" 2-2202 "," id ": 0," Roomarea ":" 2, "" Unitnum ": []," tusers "," [] "," isuse ": []" "," "" "", "" "." Buildtime ":" 2015-04-06 "},{" Doorcard ":" 3-3301 "," id ": +," Roomarea ":" Max "," Unitnum ": 3," tusers ": []," Isuse ":" 1 "," Buildtime ":" 2015-04-13 "},{" Doorcard ":" 3-2102 "," id ": $," Roomarea ":" 3, "" Unitnum ": []," tusers ": []," Isuse ":" 1 "," Buildtime ":" 2015-04-06 "}]}
The JSON format returned in the background must be such that the data cannot be identified and displayed by the foreground easyui DataGrid, otherwise the data cannot be displayed.
Five, the effect


End here
JQuery Easyui Learning--struts2 displaying database data in conjunction with the Easyui DataGrid data table