Verwandte Lesungen:
Organisieren von JQGrid Study Notes in Java - Fortgeschrittenes Kapitel (i))
Dieser Artikel beginnt offiziell mit dem Hintergrund (Java -Sprache) zu interagieren, und die verwendete Plattform ist
JDK: Java 1.8.0_71
myeclisp 2015 stabil 2.0
Apache Tomcat-8.0.30
MySQL 5.7
Navicat für MySQL 11.2.5 (MySQL -Datenbankverwaltungstool)
1. Datenbankteil
1. Erstellen Sie eine Datenbank
Erstellen Sie eine Datenbank mit Navicat für MySQL (nicht mit anderen Tools oder direkt mit der Befehlszeile eingeführt).
2.
2. Erstellen Sie eine Tabelle
Doppelklicken Sie, um den vorherigen Schritt zu öffnen, um eine Datenbank zu erstellen.
Wenn Sie die folgenden Felder erstellen, werden Sie aufgefordert, den Tabellennamen einzugeben.
2. Verfahrensteil
1. Erstellen Sie ein neues Projekt
Erstellen Sie mit MyeClipse - Webprojekt neue Neue
Geben Sie den Projektnamen ein, um Java und Tomcat auszuwählen, das das Projekt ausführt. Klicken Sie auf Weiter, bis die folgende Seite auf das Kontrollkästchen unten klicken, um die Datei web.xml automatisch zu generieren.
Erstellen Sie die folgende Paketstruktur und erstellen Sie eine neue VO -Klasse (Eigenschaften entsprechen den Datenbankfeldern nacheinander).
Demo.java
package com.xeonmic.vo;public class demo {private int id;private String name;private int type;private double pay;private String text;public demo() {// TODO Auto-generated constructor stub}public demo(int id, int type, Double pay,String name, String text) {this.id = id;this.name = name;this.type = type;this.pay = pay;this.text = text;}public int 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 type) {this.type = type;}public double getPay() {return pay;}public void setPay(Double pay) {this.pay = pay;}public String getText() {return text;}public void setText(String text) {this.text = text;}@Overridepublic String toString() {return "demo [id=" + id + ", name=" + name + ", type=" + type+ ", pay=" + pay + ", text=" + text + "]";}}2. Importieren Sie das JAR -Paket der Datenbankverbindung und die JSON -Datei
Das Datenbankverbindungs -JAR -Paket finden Sie im folgenden Verzeichnis des MySQL -Installationsverzeichnisses
Darüber hinaus wurde das für JSON erforderliche JAR-Paket auf Baidu Cloud (http://pan.baidu.com/s/1detgjrv) hochgeladen und kopiert und in das Verzeichnis webroot/web-inf/lib/lib.
Wählen Sie dann alle Klicken Sie mit der rechten Maustaste, um zum Build -Pfad hinzuzufügen
3.. Grundlegende Implementierung des DAO -Designmodells grundlegend
Siehe "Java Web Development Classic Basics". Wir werden den Quellcode nicht beschreiben und dann einen separaten Artikel schreiben, um speziell über diesen Teil des Grundwissens zu sprechen.
—3.1. DatabaseConnection.java
Paket com.xeonmic.dbc; import Java.sql.connection; import Java.sql.driverManager; Import Java.sql.sqlexception; öffentliche KlassendatenbankaConnection {private statische endgültige String dbdriver = "org.gjt.m.mysql.Driver"; Dburl = "jdbc: mysql: // localhost: 3306/jqGriddemo"; private statische endgültige Zeichenfolge dbuser = "root"; private statische Zeichenfolge dbpassword = "1234"; private Verbindung conn = null; public databaseconnection () {try {class.Dborname (dbdriver); Dbuser, dbpassword);} catch (classNotFoundException e) {// todo automatisch generierten Catch Block E.PrintStacktrace ();} catch (SQLEXception E) {// todo automatisch generiert Catch Block E. Printstacktrace ();} // system.out.println ("conn -Verbindung erfolgreich); this.conn;} public void close () {if (this.conn!—3.2. Demodao.java
Paket com.xeonmic.dao; import java.util.list; import com.xeonmic.vo.demo; öffentliche Schnittstelle Demodao {// Methode public boolean docreate hinzufügen (Demo Demo Demo Demo Demo Demo). Dochange (Demo Demo);}—3.3. DemodaoImpl.java
Paket com.xeonmic.dao.impl; Import Java.sql.Connection; Import Java.Sql.PrepararedStatement; Import Java.sql.resultset; importieren java.sql.sqlexception; importieren java. com.xeonmic.vo.demo; öffentliche Klasse DemodaoImpl -Geräte Demodao {private Verbindung conn = null; private preparedStatement pstmt = null; public DemodaoImpl (Verbindung conn) {this.conn = conn;}@oversidepublic boolean Docreat (Demo -Demo) {bayean Flag. t_demo (type, pay, name, text) Werte (?,? Demo.getName ()); this.pstmt.SetString (4, Demo.GetText ()); if (this.pstmt.executeUpdate ()> 0) {flag = true;} this.pstmt.CLOSE (); Flag;}@oversidePublic List <Deo> DoSearch (String Keys) {// Todo Auto-Generated-Methode Stubif (Keys == NULL) {Keys = "";} String SQL = "Select ID, Name, Typ, Pay, Text aus t_demo"+keys; liste <Demo> All = New Arraylist <Demo> () system.-Prints system. {this.pstmt = this.conn.preparestatement ( Demo (rs.getint ("id"), rs.getint ("type"), rs.getDouble ("pay"), rs.getString ("name"), rs.getString ("text"); All.Add (Demo);} this.pstmt.close (); } catch (SQLEXception e) {// Todo automatisch generiert Catch Block E.printstacktrace ();} return alle;}@oversidepublic boolean dodelete (int id) {boolean flag = false; String SQL = "Löschen von t_demo wob this.conn.Preparestatement (SQL); this.pstmt.Setint (1, id); if (this.pstmt.executeUpdate ()> 0) {flag = true;} this.pstmt.close ();} catch (SQLEXception E) {// todo automatisch generiert wurde blockiert E.Printstacktracing ({{// toDo), das automatisch erstellt wurde, E.Pint.pintstacktrac (); {{// toDo, das automatisch erzeugt wurde, und das fangen fanger block E.Printstacktrec (); {{// toDo, das automatisch erzeugt wurde. boolean dochange (Demo Demo) {boolean flag = false; String SQL = "Aktualisieren Sie t_demo set type =?, pay =?, name =?, text =? WHERE ID =?"; Versuchen Sie {this.pstmt = this.conn.Preparestatement (sql); this.psttt.set.set (5, 5, 5, 5, 5, 5, DeMo.Ge. Demo.GetType ()); this.pstmt.setDouble (2, Demo.getPay ()); true;} this.pstmt.close ();} catch (SQLEXception e) {// Todo automatisch generiert Catch Block e.printstacktrace ();} return flag;}}—3.5. Fabrik.java
Paket com.xeonmic.factory; import com.xeonmic.dao.demodao; import com.xeonmic.dao.proxy.demodaoproxy; öffentliche Klassenfabrik
—3.6. DeMotest.java (Durchführen eines einfachen Tests der vorherigen Methode)
package com.xeonmic.test;import java.util.LinkedList;import java.util.List;import com.xeonmic.factory.Factory;import com.xeonmic.vo.demo;public class Demotest {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); if (dosearch (null)! = null &&! dosearch (""). LinkedList <Demo> (); allDemos = factory.getDemodaOinstance (). DoSearch (Schlüssel); für (Demo Demo: AllDemos) {System.out.println (Demo.toString ());} return alldemos;} public static void docreate (Demo Demo) {if (factory.getDemodaoinstance (). Docreate (Demo) {System.OUT.Println ("add erfolgreich"); {System.out.println ("fehlgeschlagen");}} public static void dochange (Demo Demo) {if (factory.getDemodaOinstance (). Dochange (Demo)) {System.out.println ("Modification war erfolgreich"); dodelete (int id) {if (factory.getDemodaOinstance (). dodelete (id)) {System.out.println ("erfolgreich löschen");} else {System.out.println ("" Deleteed ");}}}}/** Die Ausgabe -ID -ID -ID -ID, Name, Name, Typ, Typ, Text, text, text von t_dem. Name = Name, Typ = 1, pay = 0,98, text = text] id, name, type, pay, text aus t_demo Demo [id = 1, name = name, type = 1, pay = 0,98, text = text] select id, name, type, pay, text aus t_demo Demo [id = 1, name, type, type, type, pay, pay, pay, pay, pay, pay, pay, pay, pay, pay, pay, pay, tex = 0,98, text, text [id = 1, name = name, type = 1, pay = 0,98, text = text] seterect Modifications -ID, Name, Typ, Pay, Text von t_demo wobei id = 1demo [id = 1, name = name, type = 1, pay = 0.98, text text4. JSP -Seite und Servlet Abschnitt (wichtig)
—4.1. Index.jsp (Ersetzen Sie den Inhalt von HTML -Tags in Index.html in HTML -Tags und ändern Sie den Inhalt von HTML in index.jsp und stellen Sie die folgenden Änderungen an JS vor)
<%@ page Language = "java" import = "java.util. "-// w3c // dtd html 4.01 transitional // en"> <html> <kopf> <title> Demo </title> <link rel = "styleSheet" type = "text/css" href = "css/jquery-ui.min.css"/> <link rel = "stylesheet" type "type" type "type" type "text/css"/> <link "stylesheet" type "type. href = "css/jQuery-ui.theme.min.css"/> <link rel = "styleSheet" Typ = "text/css" href = "css/ui.jqGrid-stootstrap-ui.css"/> <link rel = "stilesheet" type "text/cs" text/cs "tex/cs" tex/cs "tex/cs" tex/cs "tex/cs" tex/cs "tex/cs" tex/CSS "tef =" ui /></head><body><div id="main"><!-- where jqGrid is located--><table id="grid-table"></table><!--jqGrid Browse Navigation Bar--><div id="grid-pager"></div></div><script src="js/jquery-1.11.0.min.js" type="text/javascript" charset = "utf-8"> </script> <script src = "js/i18n/grid.locale-cn.js" type = "text/javaScript" charset = "utf-8"> </script> </script> </script Src = "js/jquery.jqGrid.Min.js" type ". Typ = "text/javaScript"> // Wenn der Datenatyp "lokal" ist, müssen Sie var grid_selector = "#grid-table"; var pager_selector = "#grid-pager"; Abrufen: "<%= Basepath%>"+"DemoServlet", // Servlet urllediturl zum Hinzufügen, Ändern und Löschen: "<%= Basepath%>"+"Demochangeservlet", // Daten: Grid_data, // Wenn datatype "Lokal", "Lokal". XML usw.) Höhe: 150, // Höhe, Tischhöhe. Kann ein Wert, einen Prozentsatz oder ein 'Auto'mType: "get", // Einreichungsmethode Colnames: [' Out-out-Order-Nummer ',' Out-Out-Typ ',' Gesamtbetrag ',' Antragsteller (Einheit) ',' Hinweis '], Colmodel: [{Name:' Id ', Index:' ID ', // Index sein. Der Parameter seiner Interaktion mit dem Hintergrund ist SIDXKEY: TRUE, // Wenn in den von der Serverseite zurückgegebenen Daten keine ID enthält, verwenden Sie dies als einziges Rowid und verwenden Sie nur eine Spalte, um diese Einstellung auszuführen. Wenn mehr als eins festgelegt ist, wird nur der erste ausgewählt, und die anderen werden die Breite ignoriert: 100, bearbeitet: false, bearbeiten: {Größe: "20", MaxLength: "30"}}, {Name 'Typ', Index: 'Typ', Breite: 200, // breite kanditable: wahr //. Optionale Werte: text, textarea, wählen Sie, Kontrollkästchen, Kennwort, Schaltfläche, Bild und Datei. {Größe: "20", MaxLength: "30"}}, {Name: 'text', Index: 'text', width: 250, sortierbar: false, bearbeitbar: true, edittype: "textarea", redoptions: {Zeilen: "2", Cols: "10"}},], Sichtweise: Wahre, //, ob die Gesamtzahl der Bräuel in den Stöckeln: Ob, ob die Gesamtzahl der Stuhlnummer in den Stöckeln ist: //, ob die Gesamtzahl der Stürme in den Stöckeln ist: //, ob die Gesamtzahl der Stöcke in den Stöcken zu sehen ist,: // ob zu zeigen, ob die Gesamtzahl der Stöcke in den Stuben stürmen: 10, // Zeigen Sie die Anzahl der Datensätze pro Seite Zeilenliste an: [10, 20, 30], // Array von Elementen, mit denen die Anzahl der Zeilen zum Anzeigen des Dropdown-Listenfelds geändert wird. Pager: Pager_Selector, // Die Browser -Navigationsleiste, in der sich die Seite und die Schaltflächen befinden, ist Altrows: True, // als alternierende Zeilentabelle festgelegt, Standard ist falsch // TOPPAGER: TRUE, // Ob die Browser -Navigationsleiste angezeigt wird, auf der Multiselect: True, ob die Browsing -Navigationsleiste Multiselect: True: True: True, // //. Die Browser -Navigationsleiste ist multiselect: true, // Ob die Browser -Navigationsleiste durch Subgrid -Tasten multiboxonly Multiscastected ist, //, ob das Kontrollfeld von Subgrid: True, // sortname: 'id', // Default -Sortiermethode (Aufstieg, Aufstieg der Auftrag erwerben), "Auftragsliste erwerben:" Return -Auftragsliste erwerben: "Die Auftragsliste:" Auftragsauftrag: "Auftragsliste", "Auftragsaufträge:" Auftragsauftrag: "Auftragsliste", "Auftragsaufträge", // // // -Adnay -Autowidth -Auftrag: "Descending Order). // automatisch-width}); // Navigationsleiste durchsuchen, um Funktionsteilcode $ hinzuzufügen (Grid_Selector) .NavGrid (Pager_Selector, {Search: True, // Abrufen hinzufügen: True: True, // add (addices können nur adoces addices angezeigt werden, wenn editable ist). oder—4.2. DemoServlet.java
Paket com.xeonmic.action; import Java.io.ioxception; import Java.util.linkedList; Import Java.util.List; Import Javax.Servlet.ServletException; importieren javax.servlet.http.httplet; import Javax.Servlet.Http. javax.servlet.http.httpServletResponse; import net.sf.json.jsonArray; net.sf.json.jsonObject; com.xeonmic.factory.factory; Long serialversionuid = 1l;/*** @see httpServlet#dagget (httpServletRequest Request, HttpServletResponse-Antwort)*/Protected void dagget (httpServletRetRetRetRetRequest-Anfrage, HttpServletResponse-Antwort) löst ServletException, IOExcexception.ScharaccoDing ("utf-8"); // Wenn hier keine Codierung festgelegt wird, gibt es eine verstümmelte Antwort. response.setheader ("cache-control", "no-cache"); int rows = Integer.Valueof (request.getParameter ("Zeilen")); // Die Anzahl der in jeder Seite angezeigten Datensätze int page = integer.valueof (request.getParameter ("Seite")); // Die aktuelle Seitenzahlenstring Sord = Request.GetParameter ("Sord"); // Sortiermethode String SIDX = Request.GetParameter ("SIDX"); // Sortieren des Spaltennamens Boolean Search = (Request.GetParameter ("_ Search"). Setzen Sie String keys = ""; // Abfragedingungsstring String if (such) {keys = "wob "{" Groupop ":" und "," Regeln ": [{" Feld ":" ID "," Op ":" EQ "," Daten ":" 1 "}, {" Feld ":" Typ "," op ":" ew "," Daten ":" 2 "}}" JsonObject JsonObject = JsonObject. Jsonobject.Fromobject (FILLOPS. (und/oder) if (jsonObject.getString ("GroupOp")! = NULL &&! ". JsonObject.getJsonArray ("Regeln"); // Ruhe jede Bedingung für (int z = 0; z <Rulesjson.size (); Z ++) {Objekt t = Rulesjson.get (z); JsonObject regeljson = jsonObject.fromObject (t); String field = regeljson.getString ("field"); String op = regeljson.getString ("op"); String data = regeljson. string = "= '"+data+"'"; break; case "ne": // ungleich string = "<> '"+data+"'"; break; case "li": // weniger als string = "<'"+data+"'"; break; case "le": // weniger als oder gleich oder gleich. "; break; case" ge ": // größer als oder gleich zu string ="> = '"+data+"' "; break; case" bw ": // zwischen ... {if (data.split (", "). Länge == 2) {string =" zwischen '"+data.Split (") [0]+"" "und'"+Data.Slit (Ssplit ("" "" "" und "+" "". '"+data+"' "; // Handle, wenn Datenfehler}} break; Fall" bn ": // nicht zwischen ... {if (data.split (", "). Länge == 2) {String =" Nicht zwischen '"+data.Split (", ") [0]+"' und '"++Data. "// Handle, wenn Datenfehler}} break; Fall" ew ": // enden mit ... string =" wie '%"+data+"' "; break; case" en ": // nicht mit ... string =" nicht wie '%"+data+"' "; '%"+data+"%' "; break; Fall" in ": // in {string =" in ("; string [] datas = data.split (", "); für (int i = 0; i <datas.length; i ++) {String+= "'"+datas [i]+"'"; if (i! = datas.length-1) {String+= ",";} else {String+= ")";}}} break; case "ni": // nicht in {String = "nicht in ("; i ++) {string+= "'"+datas [i]+"'"; if (i! = datas.length-1) {String+= ",";} else {string+= ")";}}} break; Standard: op = null; (z == Rulesjson.size ()-1) {keys+= ""+field+""+string+"";} else {keys+= ""+field+""+string+""+gruppoP+"";}}}}} // Aufstieg und absteigender SQL Anweisung Conversion if (Sidx! {System.out.println (SIDX); keys += "order by" +SIDX; System.out.println ("sord =" +sord); if (! Total = (Alllist.SIZE ()%Zeilen == 0)? (Alllist.size ()/Zeilen): (Alllist.Size ()/Zeilen): (AllList.Size ()/Zeilen) +1); int j = 0; int m = (Seite)*Zeilen; int n = (Seite). J <Alllist.size () && j <n; Total); JJSON.Accumulate ("Records", Alllist.size ()); JJSON.Accumulate ("Reihen", Jarray); System.out.println (jjson.toString (); reaktion.getWriter (). Schreiben (jjson.tosting (); HttpServletResponse-Antwort)*/Protected void dopost (httpServletRequest Request, HttpServletResponse-Antwort) löst ServletException, IOException {// todo automatisch generierte Methode Stubthis.doget (Anfrage, Antwort);}}} aus—4.3. Demochangeservlet.java
Paket com.xeonmic.action; import Java.io.ioxception; import Javax.servlet.servletException; import Javax.servlet.http.httpServlet; Import Javax.servlet.http.httpletRequest; Import Javax.Servlet.http.http. com.xeonmic.factory.factory; importieren com.xeonmic.vo.demo; DemochangeServlet der öffentlichen Klasse erweitert httpServlet {/****/private statische endgültige lange Serialversionuid = 1L;/*** Die Doget -Methode des Servlets. <br> ** Diese Methode wird aufgerufen, wenn ein Formular seine Tag -Wert -Methode entspricht.** @param Anforderung Die vom Client gesendete Anforderung an den Server* @Param -Antwort Die vom Server an den Client* @throw servleTexception angegebene Antwort Wenn ein Fehler aufgetreten ist* @throws ioException Wenn ein Fehler aufgetreten ist*/öffentliche Void -Void -Dotget (httpServletRetReTRETRETRETRETRETRECTION), HTTPRETRETRETRETRETRETRETRETRLECTREPLETS -Antwort) Die Antwort: HTTPREPLETRETRETRETRETRETRECTEL -Antwort, THECTPRAWRETRETRETRETRETRETRECTEL -Antwort) Die Antwort. {boolean flag = false; String opera = 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.getDemodaOinstance (). Dodelete (id);}} break; case "add": {int type = integer.valueof (Anfrage.GetParameter ("Typ"); double pay = double.valueOf (Anfrage ("Anfrage (" payparameter ("poy"); String -Name = String -Name = String -Name = String -Name = String -Name = String -Name = String -Name); String -Name = String -Name = String -Name = String -Name = String -Name. Request.GetParameter ("Name"); String text = request.getParameter ("text"); Demo Demo = New Demo (-1, Typ, Bezahlung, Name, Text); Flag = factory.getDemodaOinstance (). Docreate (Demo); } break; case "bearbeiten": {int id = integer.ValueOf (request.getParameter ("id")); int type = Integer = Neue Demo (ID, Typ, Bezahlung, Name, Text); Flag = factory.getDemodaOinstance (). Dochange (Demo); } break; Standard: Break;} System.out.println (Flag);}/*** Die Dopost -Methode des Servlets. <br> ** Diese Methode wird aufgerufen, wenn ein Formular seine Tag -Wert -Methode entspricht. IOException {this.doget (Anfrage, Antwort);}}—4.4web.xml
<? XSI: Schemalocation = "http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee http id = "webapp_id" Version = "3.1"> <Anzeige-Name> jqGrid </display-name> <servlet> <servlet-name> DemoServlet </servlet-name> <Servlet-Class> com.xeonmic.Action.DemoServlet </servlet-class> </servlet> <Servlet-Name> Demochanges Lassen Sie </Servlet-Name> <Servlet-Class> com.xeonmic.action.Demochangeservlet </Servlet-Class> </Servlet> <Servlet-Mapping> <Servlet-Name> DemoServlet </Servlet-Name> <URL-PUPPERN>/DemoServlet </url-Pattern> </Servlet-Mapping g> <Servlet-Mapping> <Servlet-Name> Demochangeservlet </Servlet-Name> <URL-Pattern>/Demochangeservlet </url-pattern> </servlet-mapping> <Welcome-file-List> <Welcome-File> Index.html </Welcome-file> <Welcome-file> Index. htm </Welcome-file> <Welcome-File> Index.jsp </Welcome-File> <Welcome-File> Standard.html </Welcome-File> <Welcome-File> Standard.htm </Welcome-File> <Welcome-File> default.jsp </Welcome-File> </Welcome-File-List> </web-Apps>
Zu diesem Zeitpunkt wurde die JQGRID -Einzeltabellenfunktion vollständig implementiert. Bitte lassen Sie mich wissen, ob es im Beispiel Designprobleme gibt. Der nächste Artikel beginnt, die Entwurfsimplementierung des Master- und Slave -Tisches zu lösen. Bitte achten Sie auf die Skript -Direktwebsite!