Jquerypagination Paging plugin, AJAX request data from struts

2017-07-16

Learned struts, did a small example of paging, using the jquery page plug-in pagination, first paste the plugin

http://www.jq22.com/jquery-info13734

Plug-in author for the parameter explanation is not enough detailed, pondering a half-day to understand how to use, not much to say, direct code

1. Client (JSP page)

1 /*these CSS in order to control the location of the generated data and the paging of the Li label*/2 a{3 text-decoration:None;4 Color:Black;5 Font-weight:Bold;6 text-align:Center;7}8 Table{9 width:500px;Ten Height:300px; One text-align:Center; A} - #table{ - position:relative; the Top:100px; -} - #page{ - Height:50px; + text-align:Center; - position:relative; + Top:100px; A} at #page Li{ - position:relative; -  Left:450px; -} -      - </style>

CSS Section

         　　　　 <!--Be sure to introduce style sheets and JS files -    <Linkrel= "stylesheet"type= "Text/css"href= "Pagination/page.css">    <Scripttype= "Text/javascript"src= "Pagination/jquery.min.js"></Script>    <Scripttype= "Text/javascript"src= "Pagination/page.js"></Script>      

1  　　　 <div id= "table" align= "center" ></div> <!--to display the div--> of the data2<div id= "page" class= "page" ></div> <!--Div's class to be set into the introduced CSS file .page-->3   4<script type= "Text/javascript" >5                 varurl = "${pagecontext.request.contextpath}/show_list";6                 var$table = $ ("<table border= ' 2px ' id= ' a ' width= ' 300px ' height= ' 200px ' ></table>");7                 var$TR = $ ("<tr display= ' None ' ></tr>");8                 var$TD = $ ("<td> number </td><td> name </td><td> Salary </td><td> Department </td><td> Operation </td> ");9 $tr. Append ($TD);Ten $table. Append ($tr); One                 varDatas =NULL;//datas,options must be set as a global variable, found not set to global, can not use plug-ins A                 varOptions =NULL;  -                 varPagelistcount = 6;//number of data displayed per page -             //var maxentries = 50; The total amount of data to display, not delivered the $.ajax ({ - Url:url, -Type: "GET", -DataNULL, +DataType: "JSON", -Successfunction(backdata) { +Datas =Backdata; A                         varA =eval (backdata); atoptions={  -"id": "page",//----The element where the page number is displayed (where data is placed)----> div tag above -"Data":d Atas,//-----The returned data---->json form -"Maxshowpageitem": 10,//-----The maximum number of pages to display -"Pagelistcount":p Agelistcount,//-----shows the number of data per page, the following callback is the callback function of each page plug-in -"CallBack":function(Result) {//----result represents a well-handled set of data, such as if you set Pagelistcount to 6, then result has 6 data in$ ("#table"). Append ($table);  -                                 //traverse the generated table and insert the data to$.each (Result,function(index,emp) { +$TR = $ ("<tr></tr>"); - $table. Append ($tr); the                                          for(vari=0; i<=4; i++) { *$TD = $ ("<td></td>"); $ $tr. Append ($TD);Panax Notoginseng                                         } -                                         var$TR = $ ("Table TR"); the                                         //solve problems with multi-build tables---> Total 50, 6 per page, last page less than 6, this solves the problem of multi-generation table +                                         if($tr. Size () >result.length) { A$ ("Table tr:gt (" + result.length + ")"). Remove (); the                                         } -                                         var$TD = $tr. EQ (index+1). Find ("TD"); $                                         varinfo =$ (result). get (index); $                                         var$empId = $td. EQ (0). Text (info.empid); -                                         var$empName = $td. EQ (1). Text (info.empname) -                                         var$salary = $td. EQ (2). Text (info.salary); the                                         var$dept = $td. EQ (3). Text (info.dept.deptName); -                                         var$action = $td. EQ (4). HTML ("<a href=${update}?empid=" + info.empid+ "> Modify </a>&nbsp;&nbsp;<a id = ' Del "+ Info.empid +" ' href= ' # ' > Delete </a> ");Wuyi$ ("#del" + info.empid). Click (function () { the                                             if(Window.confirm ("OK to delete?!!! cannot be recovered after deletion")) { -$( This). attr ("href", "${delete}?empid=" +info.empid); Wu                                             } -                                         }) About                                     });  $                                 } -                             }; -Page.Init (datas.length,1,options);//perform paging, 1 indicates that the first page is displayed when loading is complete -                     } A                  });  +</script> the  -</body> $    the   

2. Server

Struts is used and the returned data is in JSON format, so the following jar files are introduced

Struts Section Commons-fileupload-1.2.2. jarcommons-io-2.0.1. jarcommons-lang3-3.1. Jarfreemarker-2.3.19. jarjavassist-3.11.0. GA.JAROGNL-3.0.5. jarstruts2-core-2.3.4.1. Jarxwork-core-2.3.4.1. Jarjson part Struts2 -json-plugin-2.3.4.1. Jarjson-lib-2.3-jdk15.jarcommons-beanutils-1.7.0. jarcommons -collections-3.1. Jarezmorph-1.0.3. Jarcommons-logging-1.1.1.jar

View Code

If you add a user library, be careful to deploy the jar package to Tomcat

Project (right-click)--->buildpath--->configure build path----> Search deployment Assembly--->add--->java build path Entries

Or put the jar package directly under Webroot and add it to the project (turn it into a bottle!!) can only)

How do I get struts to return JSON text?

1. Package Inherits Json-defaulT,

in 2.result type= "JSON" , the params writes the object to be converted

3.action Be sure to set the Get method for the object you want to convert, and the object you want to convert cannot be null!!

Configuration file

< Packagename= "xxxx"extends= "json-default">    <Actionname= "Show_*"class= "Employeeaction"Method= "{1}">           <resultname= "List"type= "JSON">                <paramname= "root">listemployees</param> <!--name= "root" to get root-level objects, specifically Baidu--           </result>    </Action>            

Action

  private  list<employee>     Listemployees;  //  Just set the Get method  public  list<employee> Getlistemployees () { return   listemployees;  /**   * Employee List display *   @return  */ public  Span style= "COLOR: #000000" > String list () {listemployees   = Employeeservice.getall ();//Note Assignment  return  "list" ; }    

Of course, in addition to using struts to return to JSON can also write a servlet return data, specifically no longer repeat

I am a novice, many have insufficient also hope Haihan, criticize!!!

Jquerypagination Paging plugin, AJAX request data from struts