Lectures connexes:
Organisation des notes d'étude JQGrid dans Java - Chapitre avancé (i)
Cet article commence officiellement à interagir avec l'arrière-plan (langue java), et la plate-forme utilisée est
JDK: Java 1.8.0_71
MyEClisp 2015 Stable 2.0
Apache Tomcat-8.0.30
Mysql 5.7
NAVICAT pour MySQL 11.2.5 (MySQL Database Management Tool)
1. Pièce de base de données
1. Créer une base de données
Créez une base de données à l'aide de Navicat pour MySQL (non introduit à l'aide d'autres outils ou à l'aide de la ligne de commande directement)
2
2. Créez une table
Double-cliquez pour ouvrir l'étape précédente pour créer une base de données - Cliquez avec le bouton droit sur les tables - Sélectionnez un nouveau tableau
Lorsque vous créez les champs suivants, vous inviterez à entrer le nom de la table.
2. Pièce de procédure
1. Créez un nouveau projet
Créer nouveau à l'aide de MyEclipse - Projet Web
Entrez le nom du projet pour sélectionner Java et Tomcat exécutant le projet. Cliquez sur Suivant jusqu'à la page suivante Cliquez sur la case ci-dessous pour générer automatiquement le fichier Web.xml.
Créez la structure de package suivante et créez une nouvelle classe VO (les propriétés correspondent aux champs de base de données un par un)
démo.java
package com.xeonmic.vo; Demo de classe publique {private int id; name de chaîne privée; Type privé int; double pay; Texte de chaîne privée; Démo publique (int id, int, double, double, nom de chaîne, text de la chaîne) {this.id = id; this.name = name; this.type = type; getID () {return id;} public void setid (int id) {this.id = id;} public String getName () {return name;} public void setName (String name) {this.name = name;} public int getType () {return type;} public void SetType (int void setPay (double pay) {this.pay = pay;} public String getText () {return text;} public void SetText (String text) {this.text = text;} @ overdepublic string toString () {return "Demo [id =" + id + ", name =" + name + ", type =" + type + ", pay =" + pay + ", tex2. Importez le package JAR de la connexion de la base de données et du fichier JSON
Le package JAR de connexion de la base de données se trouve dans le répertoire suivant du répertoire d'installation MySQL
De plus, le package JAR requis pour JSON a été téléchargé sur Baidu Cloud (http://pan.baidu.com/s/1detgjrv) et copié et collé dans le répertoire Webroot / web-inf / lib.
Puis sélectionnez tout cliquez avec le bouton droit pour ajouter au chemin de construction
3. Implémentation de base en couches du modèle de conception DAO
Reportez-vous à "Java Web Development Classic Basics" ici, nous ne décrirons pas le code source, puis rédigerons un article distinct pour parler spécifiquement de cette partie des connaissances de base.
―3.1. Databaseconnection.java
package com.xeonmic.dbc; import java.sql.connection; import java.sql.drivermanager; import java.sql.sqlexception; classe publique databaseConnection {chaîne finale statique privée dbdriver = "org.gjt.mm.mysql.driver"; Dburl = "jdbc: mysql: // localhost: 3306 / jqgriddemo"; chaîne finale statique privée dbuser = "root"; chaîne finale statique privée dbpassword = "1234"; connexion privée conn = null; public databaseconnection () {try {class.forname (dbdriver); this.connn = DriverManager.getConnection (dburl, dbuser, dbpassword);} catch (classNotFoundException e) {// too généré un bloc de capture généré e.printStackTrace ();} catch (sqlexception e) {// too a automatique avec succès ");} Connexion publique getConnection () {return this.conn;} public void close () {if (this.conn! = null) {try {this.conn.close ();} catch (sqException e) {// too a automatiquement généré le bloc de capture e.printStackTrace ();}}}}―3.2. Demodao.java
package com.xeonmic.dao;import java.util.List;import com.xeonmic.vo.demo;public interface DemoDAO {//Add method public boolean doCreate(demo demo);//Query method public List<demo> doSearch(String keys);//Delete method public boolean doDelete(int id);//Modify method public boolean doChange(demo démo);}―3.3. Démodaoimpl.java
package com.xeonmic.dao.impl; import java.sql.connection; import java.sql.preparedstatement; import java.sql.resultset; import java.sql.sqlexception; import java.util.arrayList; import java.util.list; import com.xeonmic.dao.Dao.Daoo; com.xeonmic.vo.demo; classe publique Demodaoimpl implémente Demodao {Connexion privée conn = null; private préparée Pstmt = null; public Demodaoimpl (connexion conn) {this.conn = conn;} @ oversdepublic boolean docereate in (Demo Demo) {boolean drapeau = false; string sql = "INSCRANT EN INCERT UN t_demo (type, pay, nom, text) valeurs (?,? ,?) "; try {this.pstmt = this.conn.preparestatement (sql); this.pstmt.sentInt (1, Demo.getType ()); this.pstmt.setDouble (2, Demo.getpay ()); this.pstmt.SetsTring (3, Demo.Getpay ()); Demo.getName ()); this.pstmt.SetString (4, Demo.GetText ()); if (this.pstmt.executeupdate ()> 0) {flag = true;} this.pstmt.close ();} capture (sqlexception e);} Flag;} @ OverRidePublic List <Mo> DoSearch (String Keys) {// TODO GÉNÉRÉ AUTO-GÉNÉRÉ Stubif (Keys == NULL) {Keys = "";} String Sql = "SELECT ID, Name, Type, Pay, Text from t_demo" + keys; list <emo> all = new ArrayList <emo> (); System.out.Printl (Sql); this.pstmt = this.conn.preparestatement (sql); resultSet rs = this.pstmt.executequery (); démo demo = null; while (rs.next ()) {Demo = new Demo (Rs.GetInt ("ID"), Rs.GetInt ("Type"), Rs.GetDouble ("Pay"), Rs.GetString ("Name"), Rs.GetString ("Text")); all.add (démo);} this.pstmt.close (); } catch (sqlexception e) {// todo généré automatiquement le bloc de capture e.printStackTrace ();} renvoie tout;} @ overderepublic booléen dodelete (int id) {boolean flag = false; string sql = "Delete from t_demo where id =?"; try {this.pstmt = this.conn.preparestatement (sql); this.pstmt.sentInt (1, id); if (this.pstmt.executeupdate ()> 0) {Flag = true;} this.pstmt.close ();} catch (sqlexception e) {// Todo Generated Block E.PrintstackTrace ();} booléen dochange (démonstration de démonstration) {booléen flag = false; string sql = "update t_demo set type =?, pay =?, name =?, text =? où id =?"; try {this.pstmt.sentInt (5, demo.getid (); this.Stmt.Set (5, DeMo.geTid ()); this.StmT. demo.getType ()); this.pstmt.setDouble (2, Demo.getPay ()); this.pstmt.setstring (3, demo.getName ()); this.pstmt.etstring true;} this.pstmt.close ();} catch (sqlexception e) {// todo généré automatiquement le bloc de capture e.printStackTrace ();} Return Flag;}}―3.5. Usine.java
package com.xeonmic.factory; import com.xeonmic.dao.demodao; import com.xeonmic.dao.proxy.demodaoproxy; public class Factory {public static Demodao getDemodaoinstance () {return New Demodaoproxy ();}}―3.6. Demotest.java (effectuer un test simple de la méthode précédente)
package com.xeonmic.test; import java.util.linkedlist; import java.util.list; import com.xeonmic.factory.factory; import com.xeonmic.vo.demo; public class démotest {public static void main (String [] args) {DeMo DeMo1 = new Demo (); Demo1.SetName ("Name"); Demo1.SetPay (0,98); Demo1.SetType (1); Demo1.seTText ("Text"); DoCreate (Demo1); Dosearch (null). DOSEARCH (""). get (0); Demo1.SeTText ("Modifier le texte"); dochange (Demo1); Dosearch ("WHERE ID =" + Demo1.getid ()); Dodelete (Demo1.getid ()); Dosearch (null);}} public static List <Mo> Dosearch (String Keys) {List <Deemo> AllDemos = New LinkedList <emo> (); allDemos = factory.getDemodaOnistance (). DoSearch (Keys); pour (démo démo: alldemos) {system.out.println (demo.toString ());} return allDemos;} public static void doCreate (Demo Demo) {if (factory.getdemodaoinstance (). {System.out.println ("ajouter l'échec");}} public static void dochange (démon {if (factory.getdemodaoinstance (). dodelete (id)) {system.out.println ("supprimer avec succès");} else {System.out.println ("supprimer l'échec");}}} / ** Le résultat de sortie est ajouté avec succès ID SELECT, NAY, Type, Pay, T_Demo Demo [id = 1, Name = Name, Type = 1, T_Demo Demo [id = 1, NAM text = text] sélectionnez id, nom, type, payer, texte à partir de la démo t_demo [id = 1, name = name, type = 1, pay = 0.98, text = text] select id, name, type, pay, text from t_demo démo [id = 1, name = name, type = 1, pay = 0.98, text = text] select id, name, Type, PAY PAY = 0,98, text = text] Seterect Modification ID, nom, type, payer, texte de t_demo où id = 1Demo [id = 1, name = name, type = 1, pay = 0.98, text = modifier text] supprimer avec succès l'id, nom, type, payer, texte de T_demo * * /4. Page JSP et section servlet (importante)
―4.1. index.jsp (Remplacez le contenu des balises HTML dans index.html dans les balises HTML et modifiez le contenu de HTML dans index.jsp et apportez les modifications suivantes à js)
<% @ Page Language = "Java" import = "java.util. *" Pageencoding = "utf-8"%> <% String path = request.getContextPath (); String basepath = request.getscheme () + ": //" + request.getServerName () + ":" + request.getServer () + path + "/";% "- // w3c // dtd html 4.01 transitional // en"> <html> <éadf> <tight> démo </ title> <link rel = "stylesheet" type = "text / css" href = "css / jQuery-ui.min.css" /> <link rel = "Stylesheet" type = "text / csss" href = "css / jquery-ui.theme.min.css" /> <lin /> </ head> <body> <div id = "main"> <! - où jqgrid est situé -> <table id = "grid-table"> </ table> <! - JQGrid Browse Navigation Bar -> <div id = "grid-pager"> </ div> </ diving charset = "utf-8"> </ script> <script src = "js / i18n / grid.locale-cn.js" type = "text / javascript" charset = "utf-8"> </ script> <script src = "js / jQuery.jqgrid.min.js" type = "text / javascrip type = "text / javascript"> // Lorsque le type de données est "local", vous devez remplir var grid_selector = "# grid-table"; var pager_select Récupération: "<% = baspath%>" + "démoservlet", // servlet urlleDiturl utilisé pour ajouter, modifier et supprimer: "<% = baspath%>" + "DeMochangeservlet", // data: grid_data, // Lorsque datatype est "local", vous avez besoin de remplir dans le dataType: "json", // datay XML, etc.) Hauteur: 150, // Hauteur, hauteur de la table. Peut être une valeur, un pourcentage ou "Auto'Mtype:" Get ", // Méthode de soumission ColNames: ['Out-Out Order Number', 'Out-out Type', 'Montant total', 'candidat (unité)', 'Remarque'], ColModel: [{Name: 'Id', Index: 'Id', // index. Le paramètre de son interaction avec l'arrière-plan est Sidxkey: true, // Lorsqu'il n'y a pas d'ID dans les données renvoyées du côté serveur, utilisez-le comme le seul Rowid et utilisez une seule colonne pour faire ce paramètre. Si plus d'un est défini, seul le premier est sélectionné, et les autres sont ignorés dans la largeur: 100, modifiable: false, éditoptions: {size: "20", maxLength: "30"}}, {name: 'type', index: 'type', width: 200, // width éditable: true, // est indemable editType: "select", // types qui peut être édité. Valeurs facultatives: texte, textarea, sélection, case à cocher, mot de passe, bouton, image et fichier.Seditoptions: {valeur: "1: acheter et entrer; 2: retourner à l'entrée"}}, {name: 'Pay', index: 'Pay', Width: 60, SortType: "Double", éditable: true}, {name: ', index:' nom {size: "20", maxLength: "30"}}, {name: 'text', index: 'text', width: 250, sortable: false, editable: true: editType: "textarea", editoptions: {Rows: "2", Cols: "10"}},], la navigation: ViewRecords: true, // il faut afficher le nombre total de dossiers dans la navigation de la navigation: true, // Rownum: 10, // Affichez le nombre d'enregistrements par page liste de ligne: [10, 20, 30], // tableau d'éléments utilisés pour modifier le nombre de lignes pour afficher la zone de liste déroulante. Pager: Pager_selector, // La barre de navigation de navigation où se trouve la page et les boutons est altrow La barre de navigation de navigation est multiseLECT: true, // si la barre de navigation de navigation est multi-élue par Ctrl Keys Multiboxonly: true, // si la case à cocher est multi-élue par subgrid: true, // sortName: `` id '', // la méthode de tri par défaut (ASCRID ASCAND, DESC DESCENDING ORDE // Auto-largeth}); // parcourir la barre de navigation pour ajouter le code de partie de fonction $ (grid_selector) .navgrid (pager_select {}, // Modifier les options {}, // Ajouter des options {}, // delete Options {multiplesearch: true} // Options de recherche - définir plusieurs recherche);}); </cript> </ body> </html>―4.2. Demoservlet.java
package com.xeonmic.action; import java.io.ioexception; import java.util.linkedlist; import java.util.list; import javax.servlet.servletException; import javax.servlet.http.httpleservlet; import javax.servlet.http.httpsservlet javax.servlet.http.httpservletResponse; import net.sf.json.jsonArray; import net.sf.json.jsonObject; import com.xeonmic. SerialVersionUID = 1l; / *** @see httpservlet # doget (httpservletRequest request, httpservletResponse Response) * / protégée void doget (httpservletRequest request, httpservletResponse réponse) lance servlexception, ioException {request.secharacteroding // Si l'encodage n'est pas défini ici, il y aura une réponse brouillée.SetContentType ("Text / Html; charSet = UTF-8"); Response.sethEader ("Cache-Control", "No-cache"); int. // le nombre d'enregistrements affichés dans chaque page int page = Integer.ValueOf (request.getParameter ("page")); // le numéro de page actuel String sord = request.getParameter ("Sord"); // Tri Méthode String Sidx = request.getParameter ("Sidx"); // Tri Nom de la colonne Boolean Search = (request.getParameter ("_ Search"). String keys = ""; // la condition de requête String if (search) {keys = "where"; String filters = request.getParameter ("filters"); // Conditions spécifiques System.out.println (filtres); // Le format des données entrants est similaire à cela: "{" Groupop ":" et "," Règles ": [{" Field ":" Id "," OP ":" EQ "," DATA ":" 1 "}, {" Field ":" Type "," OP ":" EW "," Data ":" 2 "}]}}" JSONOBOBJECT JSONOBject = JSONOBject.fromObject (filters); String Groupop = "; (et / ou) if (jsonObject.getString ("groupOp")! = null &&! "". equals (jsonObject.getString ("groupoP"))) {if (jsonObject.getString ("groupop"). jsonObject.getJSonArray ("Règles"); // Tranquility chaque condition pour (int z = 0; z <Ruledjson.size (); z ++) {objet t = règnejson.get (z); JSONObject dulejson = jsonObject.FromObject (t); String field = dulejson.getString ("Field"); String op = dulejson.getString ("op"); String data = dulejson.getString ("data"); String String = ""; // Utilisé pour stocker une seule instruction conditionnelle SQL " string = "= '" + data + "'"; break; case "ne": // string inégal = "<> '" + data + "'"; casse; cas "li": // moins que string = "<'" + data + "'"; cass "; Break; case" ge ": // supérieur ou égal à string ="> = '"+ data +"' "; cassage; case" bw ": // entre ... {if (data.split (", "). Length == 2) {string =" entre '"+ data.split (", ") [0] +"' 'et string = ") '"+ Data +"' "; // Gire les erreurs de données}} casser; cas" bn ": // pas entre ... {if (data.split (", "). length == 2) {string =" pas entre '"+ data.split (", ") [0] +"' et '"+ data.split (", ") [1] +" "" ";" "; // gérer les erreurs de données}} casser; cas" ew ": // se terminer par ... string =" like '% "+ data +"' "; cask; case" en ": // ne se terminer pas par ... string =" pas comme '% "+ data +"' "; casse; case" cn ": // contient une chaîne =" comme '% "+ data +"%'; '% "+ data +"%' "; casse; cas" dans ": // dans {string =" dans ("; string [] datas = data.split (", "); for (int i = 0; i <datas.length; i ++) {String + = "'" + Datas [i] + "'"; if (i! = datas.length-1) {string + = ",";} else {string + = ")";}}} briss; case "ni": // not in {string = "pas dans ("; string [] datas = data. i ++) {string + = "'" + data (z == règlesjson.size () - 1) {keys + = "" + field + "" + string + "";} else {keys + = "" + field + "" + string + "" + groupOp + "";}}}}} // {System.out.println (Sidx); Keys + = "Order by" + Sidx; System.out.println ("Sord =" + Sord); if (! Sord.equals ("ASC")) {Keys + = "DESC";}} allList = factory.getDemodaOoinstance (). Total = (allList.size ()% lignes == 0)? (allList.size () / lignes): ((allList.Size () / lignes): ((allList.Size () / Rows) +1); int j = 0; int m = (page-1) * Rows; int n = (page-1) * pour les lignes; j <alllist.size () && j <n; j ++) {jArray.add (jsonObject.fromObject (allList.get (j)); Total); jjson.Accumulate ("Records", AllList.Size ()); jjson.Accumulate ("Rows", Jarray); System.out.println (jjson.tostring ()); Response.getWriter (). HttpServletResponse Response) * / Protected void doPost (HttpServLetRequest Request, HttpServletResponse Response) lève ServletException, ioException {// TODO Généré par la méthode Stubthis.Doget (demande, réponse);}}―4.3. Demochangeservlet.java
package com.xeonmic.action; import java.io.ioexception; import javax.servlet.servletException; import javax.servlet.http.httpservlet; import javax.servlet.http.httpservletRequest; import; com.xeonmic.factory.factory; import com.xeonmic.vo.demo; public class DemochangeServlet étend httpservlet {/ *** * / privé statique final SerialVersionUid = 1l; / *** la méthode DOGT du servlet. <br> ** Cette méthode est appelée lorsqu'un formulaire a sa méthode de valeur de balise équivaut à obtenir. * * @param demande la demande envoyée par le client au serveur * @param réponse la réponse envoyée par le serveur au client * @throws servlexception si une erreur s'est produite * @throws ioexception si une erreur s'est produite * / public void doget (httServleRequest request, httpServerSponsern {boolean flag = false; string opéra = request.getParameter ("oper"); switch (oper) {case "del": {string [] ids = request.getParameter ("id"). Split (","); for (int i = 0; i <ids.length; i ++) {int id = Integer.Valueof (ids [i]); flag = factory.getDemodaOoinstance (). Dodelete (id);}} Break; case "add": {int type = Integer.Valueof (request.getParameter ("Pay")); String Name = demande. = request.getParameter ("text"); démo démo = new Demo (-1, type, pay, nom, texte); Flag = factory.getDemodaOoinstance (). DoCreate (Demo); } Break; Case "Edit": {int id = Integer.ValueOf (request.getParameter ("id")); int type = Integer.Valueof (request.getParameter ("Type")); Double Pay = Double.Valueof (Name ") Demo = new Demo (id, type, pay, nom, texte); Flag = factory.getDemodaoinstance (). dochange (démo); } Break; Default: Break;} System.out.println (Flag);} / *** La méthode DOSTOST du servlet. <br> ** Cette méthode est appelée lorsqu'un formulaire a sa méthode de valeur de balise équivaut à publier. * * @param demande la demande envoyée par le client au serveur * @param réponse la réponse envoyée par le serveur au client * @throws servlexception si une erreur s'est produite * @throws ioexception si une erreur s'est produite * / public void dopost (httpserrequest request, htTPSerSERSPERSE réponse). IoException {this.doget (demande, réponse);}}―4.4.web.xml
<? xml version = "1.0" encoding = "utf-8"?> <web-app xmlns: xsi = "http://www.w3.org/2001/xmlschema-instance" xmlns = "http://xmlns.jcp.org/xml/ns/javaee" xsi: schemalocation = "http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1. id = "webApp_id" version = "3.1"> <splay-name> jqgrid </ display-name> <Servlet> <Servlet-Name> DeMoservlet </ Servlet-name> <Servlet-Class> com.xeonmic.action.demoservlet </ servlet-Class> </ Servlet> <Serplet> <Servlet-Name> DeMochangeServ LET </SERVlet-Name> <Servlet-Class> com.xeonmic.action.demochangeservlet </ servlet-Class> </ Servlet> <Servlet-Mapping> <Servlet-Name> Demoservlet </vrlett-name> <url-sapetn> / Demoservlet </ url-sterning> </ servlet-mapping g> <servlet-mapping> <servlet-name> DeMochangeservlet </vrlett-name> <url-potern> / Demochangeservlet </url-Pattern> </ Servlet-Mapping> <Welcome-File-list> <leendage-file> index.html </ bienvenue-file> <leendar-file> index. htm </ bienvenue-file> <leen welcome-file> index.jsp </ bienvenue-file> <leen welcome-file> default.html </ bienvenue-file> <ven welcome-file> default.htm </ welcome-file> </vile-file> default.jsp </venke-file> </venke-file-list> </ web-app>
À ce stade, la fonction de table unique JQGrid a été pleinement implémentée. Veuillez me faire savoir s'il y a des problèmes de conception dans l'exemple. Le prochain article commencera à résoudre la mise en œuvre de conception de la table maître et esclave. Veuillez faire attention au site Web Script Direct!