Use of flexigrid (Integrating struts2)

Source: Internet
Author: User

Flexigrid is a jquery table Plugin: http://download.csdn.net/detail/itmyhome/7613879

Usage:

I. Introduction of related resource files

<link rel="stylesheet" type="text/css" href="css/flexigrid.css"><script type="text/javascript" src="js/jquery-1.8.0.min.js"></script><script type="text/javascript" src="js/flexigrid.js"></script>

Ii. jsp page display

<Table class = "flexigrid" style = "display: none"> </table> <SCRIPT type = "text/JavaScript" >$ (function () {$ (". flexigrid "). flexigrid ({URL: 'getuseraction. action ', datatype: 'json', colmodel: [{display: 'name', name: 'username', width: 120, sortable: True, align: 'center '}, {display: 'Organization name', name: 'orgname', width: 120, sortable: True, align: 'center'}, {display: 'status', Name: 'State', width: 100, sortable: True, align: 'center'}, {display: 'username ', name: 'loginname', width: 120, sortable: True, align: 'center'}, {display: 'creation time', name: 'ctime', width: 120, sortable: True, align: 'center'}, {display: 'note', name: 'note', width: 120, sortable: True, align: 'center'}], buttons: [{Name: 'add', bclass: 'add', onpress: Add}, {Name: 'delete', bclass: 'delete', onpress: del}, {Name: 'edit', bclass: 'edit ', onpress: Edit}], sortorder: "ASC", usepager: True, Title: 'personnel information list', userp: True, RP: 10, // default number of results per page pagestat: 'display records from {from} to {to}, total number of {total} ', // Chinese display style pagetext: 'Current page ', outof: 'total pages', showtabletogglebtn: false, resizable: True, width: 'auto', height: 265}); function add () {alert ("add ");} function del () {alert ("delete");} function edit () {alert ("edit") ;}}) </SCRIPT>

Iii. Struts Configuration

<package name="user_json" extends="json-default"><action name="getUserAction" method="queryAll" class="com.home.web.UserAction"> <result name="success" type="json"></result>  </action></package>

Iv. Background code implementation

Import Java. io. ioexception; import Java. SQL. connection; import Java. SQL. resultset; import Java. SQL. resultsetmetadata; import Java. SQL. sqlexception; import Java. SQL. statement; import Java. util. arraylist; import Java. util. hashmap; import Java. util. list; import Java. util. map; import COM. home. util. connectionmanager; public class useraction {// result set Private list <Map <string, Object> rows = new arraylist <Map <string, Object> (); private integer page = 1; // Private integer total on the current page; // total number of records private integer RP; // number of records per page Public String queryall () throws ioexception {statement sta = NULL; resultset rs = NULL; try {connection conn = connectionmanager. getconnection (); STA = Conn. createstatement (); // MySQL paging string SQL = "select username, orgname, state, loginname, ctime, note from e_user limit" + (page-1) * RP + ", "+ RP; RS = sta.exe cutequery (SQL); resultsetmetadata MD = Rs. getmetadata (); // get the result set structure information, metadata int columncount = md. getcolumncount (); While (RS. next () {Map <string, Object> rowdata = new hashmap <string, Object> (); For (INT I = 1; I <= columncount; I ++) {rowdata. put (MD. getcolumnname (I), RS. getObject (I);} rows. add (rowdata);} Total = connectionmanager. getrows (); connectionmanager. closeall (RS, STA, Conn); // close resource} catch (sqlexception e) {e. printstacktrace ();} return "success";} Public String forsend () {return "success";} public list <Map <string, Object> getrows () {return rows;} public void setrows (list <Map <string, Object> rows) {This. rows = rows;} public integer getpage () {return page;} public void setpage (integer page) {This. page = page;} public integer gettotal () {return total;} public void settotal (integer total) {This. total = total;} public integer getrp () {return RP;} public void setrp (integer RP) {This. rp = RP ;}}

Page effect:


The backend Data Query code is based on MySQL and JDBC.

Source code download: http://download.csdn.net/detail/itmyhome/7613879


Reprinted please indicate the source: http://blog.csdn.net/itmyhome1990/article/details/37599503





Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.