Plug-in effects
1.JSP page
1 <%@ page language= "java" contenttype= "text/html; Charset=utf-8 "2 pageencoding=" UTF-8 "%> 3 <%@ include file="/inc/taglibs.jsp "%> 4 <! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01 transitional//en" "Http://www.w3.org/TR/html4/loose.dtd" > 5 2.script page
2.1flexgrid Plugin Page
1 <script> 2 $ (function () {3 $ ("#flexgrid") 4. Flexigrid (5 {6 URL: "${ctx}/business/findusers.jsp", 7 dataType: "JSON ", 8 Colmodel: [9 {10 Display: "Account", one name: "username", 12 Width:90, sortable:true,//can be sorted by 14 Align: "center" 15}, 16 {17 Display: "Name", + Name: "Realname", 19 Width:90, Sortable:true, 21 AlIGN: "Center" 22}, 23 {24 Display: "Points", + Name: "Score", 26 Minwidth:90, Sortable:true, 28 Align: "center" 29}, 30 {31 Display: "Age", + Name: "Ages", 33 Width:90, Sortable:true, 35 Align: "center" 36}, 37 {38 Display: "Date of birth", "Birthday", 40 minwidth:120, Sortable:true, 42 Align: "center" 43}, 44 {45 Display: "Operation", "username", 47 Minwidth:120, Sortable:true, 49 Align: "center", Process:function (val, id) { N-var un = $ (val). html (); val.innerhtml return = "<a href= ' # ' onclick= ' T_open1 (\" "53 + un + "\") ' > Modify </a> ; <a href= ' # ' onclick= ' layout (\ "" 55 + un + "\") ' > Delete </a> '; + +}], Rtname: "username", SortOrder: "desc", striped:true,//Yes No show zebra effect usepager:true, Idproperty: ' ID ',//bind the primary key ID, column format used. Nowrap:true,//Whether the line is not wrapped if the background receive data after a \ n character nomsg: ' No Related Records ', No results in the bottom right corner of the message display autoload:true,//auto-loading, that is, the first AJAX request to launch//t Itle: "User L", Pagestat: "Show records from {-} to}, totals {total} bar", Erp:true, rp:10,//number of data bars displayed by default per page rpoptions: [5, 10, 15, 2 0, +, Resizable:false,//table), whether or not it can be extendedShrink procmsg: "Load, please wait ...", Showtabletogglebtn:true, 74 Buttons: [{page name: ' Add ', 76 Bclass: "Add", Onpress:t_open 78}] 79 }); Addformdata () () () {$ var dt = $ (' #sform '). Serializearray (); $ ("#flexgrid" ). Flexoptions ({PARAMS:DT 85});////resets some parameters of the table to return true; (' #sform '). Submit (function () {* * var dt = $ (' #sform '). Serializearray (); 91 $ (' #flexgrid '). Flexoptions ({PARAMS:DT, newp:1 94}). Flexrelo AD (); return false; 96}); ) </script>
2.2jbox Response Function Area
1 <script> 2 function T_open () {3//content property (five values in total): HTML:, ID:, Get:, Post:, iframe:, 4 jbox.open ("If Rame:${ctx}/view/user/adduser.jsp "," Add User "," 5 ",", "," {6 "," {} "," Buttons "," 7 "," {"}" $ ("#flexgrid"). Flexreload (); 8} 9});}11 function T_open1 (username) {//content attribute (total of five values): HTML:, ID:, Get:, Post: , iframe:,13 jbox.open ("iframe:${ctx}/view/user/editor.jsp?username=" + username,14 "Modify user", 500, 40 0, {buttons: {},16 closed:function () {$ $ ("#flexgri D "). Flexreload (),}19}),}21 function layout (username) {$ var ur L = "${ctx}/business/dodelete.jsp?username=" +username;23 var submit = function (V, h, f) {if (v = = t Rue) {$.post (url,function (data) {window.parent.jBox.close ();}29};30 jbox.confirm ("Are you sure you want to delete the" + username + "User? "," hint ", submit, {ID: ' hahaha ', showscrolling:false,34 buttons: {35 ' OK ': true,36 ' Cancel ': false37},38//Refresh function for page data refresh in the Closed:function ( ) {$ ("#flexgrid"). Flexreload ();}42});}44 </script>
Insert data in 3.json format
1 <%@ page language= "java" contenttype= "text/html; charset=utf-8" pageencoding= "UTF-8"%> 2 <%@ page Import= "Java.io.printwriter,com.ifly.ms.utils.pagebean,com.ifly.ms.beans.userbean"%> 3 <jsp:useBean id= "UB" class= "Com.ifly.ms.beans.UserBean" ></jsp:useBean> 4 5 <% 6//Get the value of the page variable in the plug-in 7 int count= Integer.parseint (Request.getparameter ("page")); 8//Gets the value of the RP variable in the plug-in 9 int count1=integer.parseint (Request.getparameter ("RP")); Pagebean<userbean> pagebean=new Pagebean<userbean> (); Pagebean.setpage (count); Pagebean.setrp (count1);//pagebean Get List Object pagebean= Ub.queryrows (Pagebean); 15//Set Output format Response.setcontenttype ("Application/json;charset=utf-8"); 17 Response.setcharacterencoding ("UTF-8"); PrintWriter writer=response.getwriter (); 19//Call ToString to convert the object to Json20 String json=pagebean.tostring (); 21//writes JSON into the plugin writer.write (JSON),//SYSTEM.OUT.PRINTLN (JSON), Writer.flush ();%>
4. tostring method for converting objects to JSON
Public String ToString () { return Jsonobject.frombean (this). ToString ();
Note that the parameters in the Pagebean class need to be consistent with the FlexGrid plug-in, so you need to define the following variables
1 package com.ifly.ms.utils; 2 3 Import java.util.List; 4 5 Import Net.sf.json.JSONObject; 6 7/** 8 * @desc: myschedule_1107 9 * @author: Administrator10 * @createTime: November 7, 2013 PM 8:20:1111 * @history: 12 * @version: v1.013 * @param <t>14 */15 public class Pagebean<t> {16/**17 * Total Pages */19 pri vate int rp;20/**21 * @return the rp22 */23 public int getrp () {return rp;25}26/** * @param RP-the RP-set28 */29 public void setrp (int rp) {this.rp = rp;31}32/**33 * Total pages */35 private int total;36/**37 * Default current page */39 private int page;40/**41 * Data collection */43 private list<t> rows;44/**45 * @return The total46 */47-public int Gettotal () {total;50 return}51/**52 * @param total the total to set53 */54 public void Settotal (int total) {this.total = Total;56}57/**58 * @return the page59 */60 public int GetPage *64 * @param page the page to set65 */66 public void setpage (int page) {this.page = page;68} /**71 * @return The rows72 */73 public list<t> getRows () {return rows;75 }76/**77 * @param rows The rows to set78 */79 public void setrows (list<t> rows) {. rows = rows;81}82 public String toString () {Jsonobject.frombean-return (this). ToString (); 84}85}
Required jar package for JSON format conversion
(go) Json+flexgrid+jbox combination use page refresh <jsp>