Java Integration Easyui to delete and change operations

First, please.

Show all user information

Add user Information

Delete User Information

Edit user Information

Here's a look at Easyui's crud, how it's exchanged with the background in Java

Foreground HTML page, I'll name it crud1.html

1. First is a DataGrid, marked by class,

About the URL directly to the official explanation: to the load data from the remote server, you should set ' URL ' peoperty, where Server would return JSON format data

followed by pagination (pagination), its official explanation is

Set ' pagination ' to true, which would generate a pagination bar on the DataGrid bottom. The pagination would send the parameters to server:

• Page:the page number, start with 1.
• Rows:the page rows per page.

Then the official explanation for thread is that the DataGrid columns is defined in <thead> markup (the column of the DataGrid is defined in the <thread> tag)

2. Toolbars

About the toolbar, We don ' t need to write any JavaScript code, attach a toolbar to the DataGrid via ' toolbar ' attribute.

The tool bar completes the call by using the OnClick method that is written in the definition.

3. Methods defined in the toolbar

Method is located in JS, for example, such as: NewUser This method

Clicking on the "Add User" toolbar will invoke the NewUser () method in JS.

(1) Open the dialog with the ID of Dlg, and the title of the dialog box is set to "Add User"

$ ("#dlg"). Dialog (' Open '). dialog (' Settitle ', ' Add user ');

(2) The definition of the dialog box, which is defined in the body, is not explained here much

<div id= "Dlg" class= "Easyui-dialog" style= "width:400px;height:250px;padding:10px 20px" closed= "true" buttons = "#dlg-buttons" > <form id= "FM" method= "POST" > <table cellspacing= "10px;" > <tr> <td> name:</td> <td><input name= "name" class= "Easyui-validatebox" R Equired= "true" style= "width:200px;" ></td> </tr> <tr> <td> Contact phone:</td> <td><input name= "ph One "class=" Easyui-validatebox "required=" true "style=" width:200px; " ></td> </tr> <tr> <td>Email:</td> <td><input name= "E Mail "class=" Easyui-validatebox "validtype=" email "required=" true "style=" width:200px; " ></td> </tr> <tr> <td>QQ:</td> <td><input name= "QQ" class= "Easyui-validatebox" required= "true" style= "width:200px;" ></td> </tr>       </table> </form></div> <div id= "dlg-buttons" ><a href= "javascript:void (0)" Clas s= "Easyui-linkbutton" iconcls= "Icon-ok" onclick= "Saveuser ()" > Save </a><a href= "javascript:void (0)" class= "Easyui-linkbutton" iconcls= "Icon-cancel" onclick= "javascript:$ (' #dlg '). Dialog (' Close ') ' > Close </a></div >

(3) Clear the contents of the dialog box

$ (' #fm '). Form (' clear ');

(4) Interacting with a background Java program via Ajax

Url= ' Usersave ';

The Java program in the background is like this

Accept the user's incoming four values, complete the database related operations, and then put the return value of the result, into a jsonobject

public class Usersaveservlet extends httpservlet{/** * */private static final long serialversionuid = 1l;dbutil Dbutil=ne W Dbutil (); Userdao userdao=new Userdao (); @Overrideprotected void doget (HttpServletRequest request, httpservletresponse response) Throws Servletexception, IOException {this.doget (request, response);} @Overrideprotected void DoPost (HttpServletRequest request, httpservletresponse response) throws Servletexception, IOException {request.setcharacterencoding ("utf-8"); String name=request.getparameter ("name"); String phone=request.getparameter ("phone"); String email=request.getparameter ("email"); String Qq=request.getparameter ("QQ"); String id=request.getparameter ("id"); User User=new User (name, phone, email, QQ), if (Stringutil.isnotempty (ID)) {user.setid (Integer.parseint (ID));} Connection con=null;try {int Savenums=0;con=dbutil.getcon (); Jsonobject result=new jsonobject (); if (Stringutil.isnotempty (ID)) {savenums=userdao.usermodify (con, user);} Else{savenums=userdao.useradd (con, user);} If(savenums==1) {Result.put ("Success", "true");} Else{result.put ("Success", "true"); Result.put ("ErrorMsg", "Save Succeeded");} Responseutil.write (response, result);} catch (Exception e) {//TODO auto-generated catch Blocke.printstacktrace ();} finally{try {Dbutil.closecon (con);} catch (Exception e) {//TODO auto-generated catch Blocke.printstacktrace ();}}}

Well, the above is the complete Easyui and background Java program Interactive process.

The complete code is posted below:

Project structure:

Database Build Table statement: is a t_user table

/*sqlyog Enterprise Edition-MySQL GUI v8.14 mysql-5.1.49-community:database-db_easyui******************************************** *!40101 set NAMES UTF8 */;/*!40101 set sql_mode= ' */;/*!40014 set @[email protected]@ Unique_checks, unique_checks=0 */;/*!40014 SET @[email protected] @FOREIGN_KEY_CHECKS, foreign_key_checks=0 */;/ *!40101 set @[email protected] @SQL_MODE, sql_mode= ' No_auto_value_on_zero ' */;/*!40111 set @[email  Protected] @SQL_NOTES, sql_notes=0 */; CREATE DATABASE/*!32312 IF not exists*/' Db_easyui '/*!40100 DEFAULT CHARACTER SET UTF8 */; Use ' Db_easyui ',/*table structure for table ' t_user ' */drop table IF EXISTS ' T_user '; CREATE TABLE ' T_user ' (' id ' int (one) not null auto_increment, ' name ' varchar) DEFAULT NULL, ' phone ' varchar DEFA ULT null, ' email ' varchar (default NULL, ' QQ ' varchar () default NULL, PRIMARY KEY (' id ')) engine=innodb Auto_incre Ment=21 DEFAULT charset=utf8;/*data for the table ' t_user ' */

Front Page crud1.html

public class Pagebean {private int page;//number of pages private int rows;//records per page private int start;//Start Page        //Omit Get and set method}

public class User {private int id;private string Name;private string phone;private string email;private string Qq;public U Ser () {}public User (string name, string phone, string email, string qq) {this.name = Name;this.phone = Phone;this.email = EMAIL;THIS.QQ = QQ;}        Omit get and Set methods}

Tool class:

(1) The class that connects the database

public class Dbutil {private String dburl= "Jdbc:mysql://localhost:3306/db_easyui";p rivate String dbusername= "root"; private string dbpassword= "root";p rivate string jdbcname= "Com.mysql.jdbc.Driver";p ublic Connection Getcon () throws Exception{class.forname (Jdbcname); Connection con=drivermanager.getconnection (Dburl,dbusername,dbpassword); return con;} public void Closecon (Connection con) throws Exception{if (Con!=null) {con.close ();}}}

(2) The tool class public class Jsonutil {/** * Converts result to JSON array format * @param rs * @return * @throws Exception */pub Lic static Jsonarray Formatrstojsonarray (ResultSet rs) throws Exception{resultsetmetadata Md=rs.getmetadata (); int num= Md.getcolumncount (); Jsonarray array=new Jsonarray (); while (Rs.next ()) {Jsonobject mapofcolvalues=new jsonobject (); for (int i=1;i<=num;i + +) {mapofcolvalues.put (Md.getcolumnname (i), rs.getobject (i));} Array.add (mapofcolvalues);} return array;}}

(3) class to output information to the page

public class Responseutil {public static void write (HttpServletResponse response,object o) throws exception{ Response.setcontenttype ("Text/html;charset=utf-8"); PrintWriter out=response.getwriter (); Out.print (o.tostring ()); Out.flush (); Out.close ();}}

Here is the control layer controller

Controller to delete user information

public class Userdeleteservlet extends httpservlet{/** * */private static final long serialversionuid = 1l;dbutil dbutil= New Dbutil (); Userdao userdao=new Userdao (); @Overrideprotected void doget (HttpServletRequest request, httpservletresponse response) Throws Servletexception, IOException {this.doget (request, response);} @Overrideprotected void DoPost (HttpServletRequest request, httpservletresponse response) throws Servletexception, IOException {//String Delid=request.getparameter ("Delid"); String delid=request.getparameter ("Delid"); Connection con=null;try {Con=dbutil.getcon (); Jsonobject result=new jsonobject (); int delnums=userdao.userdelete (Con, delid), if (delnums==1) {result.put ("success", "true");} Else{result.put ("ErrorMsg", "Delete failed"); Responseutil.write (response, result);} catch (Exception e) {//TODO auto-generated catch Blocke.printstacktrace ();} finally{try {Dbutil.closecon (con);} catch (Exception e) {//TODO auto-generated catch Blocke.printstacktrace ();}}}

Controller that displays user information

public class Userlistservlet extends httpservlet{/** * */private static final long serialversionuid = 1l;dbutil Dbutil=ne W Dbutil (); Userdao userdao=new Userdao (); @Overrideprotected void doget (HttpServletRequest request, httpservletresponse response) Throws Servletexception, IOException {this.doget (request, response);} @Overrideprotected void DoPost (HttpServletRequest request, httpservletresponse response) throws Servletexception, IOException {String page=request.getparameter ("page"); String rows=request.getparameter ("Rows"); Pagebean pagebean=new Pagebean (Integer.parseint (page), Integer.parseint (rows)); Connection con=null;try {Con=dbutil.getcon (); Jsonobject result=new jsonobject (); Jsonarray Jsonarray=jsonutil.formatrstojsonarray (Userdao.userlist (Con, pagebean)); int Total=userdao.usercount (con ); Result.put ("Rows", Jsonarray); Result.put ("Total", total); Responseutil.write (response, result);} catch (Exception e) {//TODO auto-generated catch Blocke.printstacktrace ();} Finally{try {Dbutil.closecon(con);} catch (Exception e) {//TODO auto-generated catch Blocke.printstacktrace ();}}}

Controller that holds user information

public class Usersaveservlet extends httpservlet{/** * */private static final long serialversionuid = 1l;dbutil Dbutil=ne W Dbutil (); Userdao userdao=new Userdao (); @Overrideprotected void doget (HttpServletRequest request, httpservletresponse response) Throws Servletexception, IOException {this.doget (request, response);} @Overrideprotected void DoPost (HttpServletRequest request, httpservletresponse response) throws Servletexception, IOException {request.setcharacterencoding ("utf-8"); String name=request.getparameter ("name"); String phone=request.getparameter ("phone"); String email=request.getparameter ("email"); String Qq=request.getparameter ("QQ"); String id=request.getparameter ("id"); User User=new User (name, phone, email, QQ), if (Stringutil.isnotempty (ID)) {user.setid (Integer.parseint (ID));} Connection con=null;try {int Savenums=0;con=dbutil.getcon (); Jsonobject result=new jsonobject (); if (Stringutil.isnotempty (ID)) {savenums=userdao.usermodify (con, user);} Else{savenums=userdao.useradd (con, user);} If(savenums==1) {Result.put ("Success", "true");} Else{result.put ("Success", "true"); Result.put ("ErrorMsg", "Save Succeeded");} Responseutil.write (response, result);} catch (Exception e) {//TODO auto-generated catch Blocke.printstacktrace ();} finally{try {Dbutil.closecon (con);} catch (Exception e) {//TODO auto-generated catch Blocke.printstacktrace ();}}}

Finally attach the configuration file Web. xml

<servlet> <servlet-name>userListServlet</servlet-name> <servlet-class> com.qzp.web.userlistservlet</servlet-class> </servlet> <servlet> <servlet-name>  Userdeleteservlet</servlet-name> <servlet-class>com.qzp.web.UserDeleteServlet</servlet-class> </servlet> <servlet> <servlet-name>userSaveServlet</servlet-name> <servlet-class> com.qzp.web.usersaveservlet</servlet-class> </servlet> <servlet-mapping> <servlet-name>    Userlistservlet</servlet-name> <url-pattern>/userList</url-pattern> </servlet-mapping> <servlet-mapping> <servlet-name>userDeleteServlet</servlet-name> <url-pattern>/ userdelete</url-pattern> </servlet-mapping> <servlet-mapping> <servlet-name> Usersaveservlet</servlet-name> <url-pattern>/userSave</url-pattern> </servlet-mapping>

Java Integration Easyui to delete and change operations