Das Prinzip des Hinzufügens eines Produktteils entspricht dem Hinzufügen einer Produktkategorie. Weitere Informationen finden Sie im Artikel: Hinzufügen und Aktualisieren einer Produktkategorie , ist jedoch komplizierter als eine Produktkategorie. Da es viele Attribute des Produkts gibt, gibt es in der entsprechenden Datenbank mehr Felder. Es gibt auch eine Option, um ein Produkt zum Hochladen von Bildern hinzuzufügen. Dieser kleine Inhalt wird im nächsten Artikel getrennt erläutert, da dies einen Wissenspunkt beinhaltet, nämlich, dass Struts2 die Datei -Upload -Funktion implementiert. Ich werde nicht viel mehr sagen. Jetzt werde ich beginnen, den Code zum Hinzufügen des Produktteils zu verbessern:
1. Produkte hinzufügen
1.1 Hinzufügen von UI -Implementierung für Produkte <BR /> Füllen Sie zuerst den Code zum Hinzufügen von Produktparts in query.jsp aus:
Schauen wir uns als nächstes die spezifische Implementierung in Save.jsp an:
<%@ page Language = "java" import = "java.util. Rand: 10px; } </style> <script type = "text/javaScript"> $ (function () {// benutzerdefinierte Verifizierungsmethode registriert die neue Funktion $ .extend ($. fn.validateBox Format: {// Die Funktionsinformation, wenn sie false zurückgibt, kann die Überprüfung nicht validatorisch (Wert, Param) {// den Suffixnamen der aktuellen Datei var ext = value.substring (value.lastindexof (') + 1) arr.length; i ++) {if (ext == arr []) Return; JSON-Format und senden Sie es an URL: 'category_query.action', valueField: 'id', textfield: 'type', // Die Dropdown-Liste zeigt alle Produktkategorien PanelHeight: 'auto', // Adaptive Höhe Panelbreite: 120, // Die Dropdown-Liste ist eine Breite: 120. // Combobox erbt die Combo erbt validateBox, sodass Sie die Bestätigung direkt hier festlegen können $ ("input [name = name]"). validateBox ({erforderlich: true, fehlendeMessage: 'Bitte geben Sie den Produktnamen ein'}); $ ("input [name = price]"). numberBox ({erforderlich: true, fehlendeMessage: 'Bitte geben Sie den Produktpreis ein. $ ("input [name = 'fileImage.Upload']"). ValidateBox ({erforderlich: true, fehlendeMessage: 'Bitte laden Sie das Produktbild hoch', // Setzen Sie benutzerdefinierte Methoden validType: "Format ['Gif, JPG, JPEG, PNG']" // Die Klammern sind Parameter}); $ ("textArea [name = merchens]"). validateBox ({erforderlich: true, fehlendeMessage: 'Bitte geben Sie eine einfache Beschreibung des Produkts ein}); $ ("textArea [name = xremark]"). ValidateBox ({erforderlich: true, fehlendeMessage: 'Bitte geben Sie eine einfache Beschreibung des Produkts ein'}); $ ("textArea [name = xremark]"). ValidateBox ({erforderlich: true, fehlendeMessage: 'Bitte geben Sie eine einfache Beschreibung des Produkts ein'}); // Überprüfung $ deaktivieren ("#ff"). Formular ("DisableValidation"); // Registrieren Sie das Ereignis der Schaltfläche $ ("#subieren"). Click (function () {// Verifizierung $ ("#ff"). Formular ("enableValidation"); // Wenn die Verifizierung erfolgreich ist, senden Sie Daten, wenn ($ ("#ff"). 'product_save.action', Erfolg: function () {//, wenn erfolgreich das aktuelle Fenster übergeordnet ist. // Ereignisse $ ("#Reset"). Click (function () {$ ("#ff"). Formular ("DisableValidation"); // Reset erfordert keine Formularüberprüfung // Das aktuelle Formulardaten $ zurücksetzen ("#ff"). Formular ("Reset");}); }); </script> </head> <body> <form id = "ff" methode = "post" engType = "MultiPart/Form-Data"> <div> <label> Produktname: </label> <Eingabe type = "text" name = "name"/> </div> <div> </div> </div> </div> </label> </</</</</</</</</</</</</</</> </> </> </</</</</</</</</</</</</</</text "upLad:" type="file" name="fileImage.upload" /> </div> <div> <label>Category:</label> <input id="cc" name="category.id"/> </div> <div> <label>Add to recommend:</label> Recommended:</label> Recommended: <input type="radio" name="commend" checked="checked" value="true" /> Not recommended: <input type = "radio" name = "commend" value = "false"/> </div> <div> <label> Ist es gültig? cols = "40" rows = "4"> </textArea> </div> <div> <label> Detaillierte Beschreibung: </label> <textArea name = "xremark" cols = "40" rows = "8"> </textArea> </div> <a id = "sure </div> </form> </body> </html>Schauen wir uns hauptsächlich den benutzerdefinierten Methodenteil im obigen JS -Code an, wodurch die Überprüfung der hochgeladenen Bilder hauptsächlich definiert. Die spezifische Analyse ist wie folgt:
Anschließend können Sie eine benutzerdefinierte Methode im Abschnitt zur Bildüberprüfung verwenden:
1.2 Die Hintergrundimplementierung von Produkten Hinzufügen von Produkten
@Controller ("productAction") @Scope ("Prototyp") ProductAction erweitert Baseaction <Produkts> {// andere Codes weglassen ... public void Save () löst Ausnahme aus {// Hochgeladene Bilder verarbeiten, das nächste Blog analysiert spezifisch das Upload von Strümpfe2 -Dateimodell. // Legen Sie die aktuelle Zeit fest, da die Rezeption das Zeitfeld nicht übergibt, sondern selbst einstellen. System.out.println (Modell); // Produktinformationen Speicherproduktservice.Save (Modell); }} 2. Aktualisieren Sie das Produkt
2.1 Aktualisieren Sie die UI -Implementierung des Produkts
Schauen Sie sich zunächst den Code für den aktualisierten Produktteil in query.jsp an:
Schauen wir uns als nächstes einen Blick auf den Inhalt von Update.jsp:
<%@ page Language = "java" import = "java.util. Rand: 5px; } </style> <script type = "text/javaScript"> $ (function () {// datagrid -Objekt var dg = parent. $ ("iframe [title = 'product Management']. Get (0). Geben Sie die verarbeiteten Daten auf diese Seite zurück, um sie anzuzeigen, sodass der Hintergrund die Daten in das JSON-Format verpacken und an URL: 'category_query.action', ValueField: 'ID', Textfield: 'Typ', // Unsere Dropdown-Liste zeigt die Produktname des Produkts an. Gleichzeitig ermöglicht es nicht zu, dass die Combobox-Erben von Combobox-Erben nicht zulässt. // Laden Sie das entsprechende Datenfeld der Zeile, das Sie in das Formular erhalten, um $ $ ("#ff"). Formular ('Load', {id: Zeilen [0] .id, Name: Zeilen [0] .Name, Preis: Zeilen [0] .Price, Bemerkung: Zeilen [0] .Remark, Xremark: Reihen [0]. Öffnen: Zeilen [0] .Open, 'category.id': Zeilen [0] .Category.id // Easyui unterstützt kein Konto. // Setzen Sie nach dem Echo der Daten die Überprüfungsfunktion $ ("input [name = name]"). ValidateBox ({erforderlich: true, fehlendeMessage: 'Bitte geben Sie den Kategorie -Namen'} ein); $ ("input [name = price]"). numberBox ({erforderlich: true, fehlendeMessage: 'Bitte geben Sie den Produktpreis ein. $ ("input [name = 'fileImage.Upload']"). ValidateBox ({erforderlich: true, fehlendeMessage: 'Bitte laden Sie das Produktbild hoch', // Setzen Sie benutzerdefinierte Methoden validType: "Format ['Gif, JPG, JPEG, PNG']" // Die Klammern sind Parameter}); $ ("textArea [name = merchens]"). validateBox ({erforderlich: true, fehlendeMessage: 'Bitte geben Sie eine einfache Beschreibung des Produkts ein}); $ ("textArea [name = xremark]"). ValidateBox ({erforderlich: true, fehlendeMessage: 'Bitte geben Sie eine einfache Beschreibung des Produkts ein'}); $ ("textArea [name = xremark]"). ValidateBox ({erforderlich: true, fehlendeMessage: 'Bitte geben Sie eine einfache Beschreibung des Produkts ein'}); // Überprüfung $ deaktivieren ("#ff"). Formular ("DisableValidation"); // Ereignis von // Taste der Schaltfläche $ ("#btn"). Click (function () {// Verifizierung $ ("#ff"). Formular ("enableValidation"); // Wenn die Verifizierung erfolgreich ist, senden Sie Daten, wenn ($ ("#ff"). 'protous_update.action', // Die Anforderung an die Aktualisierungsmethode von ProductAction ausführt: Funktion () {// Wenn erfolgreich das aktuelle Fenster ist und den übergeordneten übergeordneten übergeordnet ist. $ ("#win"). }); </script> </head> <body> <form id = "ff" methode = "post" engType = "MultiPart/Form-Data"> <div> <Label für = "Name"> Produktname: </label> <Eingabe type = "Text" name "name" name "/> </div> <div> <label für =" preis <label> Bild aktualisieren: </label> <Eingabe type = "Datei" name = "FileImage.Upload"/> </div> <div> <Label für = "account"> Produktkategorie: </label> <!-Remote-Ladeadministratordaten-> <Eingabe id = "cc" name = "category.id"/> </> </</div> <div> <div> <div> cols = "40" rows = "4"> </textArea> </div> <div> <label for = "xremark"> Detaillierte Beschreibung: </label> <textArea name = "xremark" cols = "40" Rows = "8"> </textarea> </div> <div> <div> <dives = "commend"> commend ">" commend ">" commend ">" commend ">" commend ">" commend ">" commend ">" commend ">" commend ">: </label: </label: </label: </label: </label: </label" y Input ". value = "true" /> no: <input type = "radio" name = "commend" value = "false" /> < /div> <div> <label für = "öffnen"> Effektive Produkte: < /label> Auflistet: <Eingabe type = "radio" name = "open" value = "true" /> entfernt: <"radio" name = "value". data-options = "iconcls: 'icon-edit'"> update </a> <Eingabe type = "hidden" name = "id"/> </div> `</form> </body> </html> Der Update -Teil entspricht im Grunde genommen dem Update der Produktkategorie. Ich werde es nicht noch einmal wiederholen. Das Folgende ist die Implementierung des Teils des Hintergrund -Update:
2.2 Aktualisierte Produkthintergrundierung von Produkten
@Controller ("productAction") @Scope ("Prototyp") ProductAction erweitert Baseacction <Produkts> {// andere Codes weglassen ... public void update () löst die Ausnahme aus {// verarbeiten Sie die hochgeladenen Bilder und das nächste Blog analysiert spezifisch das Upload von Strüteten2 model.setdate (New Date (New Date)); // Legen Sie die aktuelle Zeit fest, da die Rezeption das Zeitfeld nicht übergibt, sondern selbst einstellen. System.out.println (Modell); // Product ProductService.Update (Modell) aktualisieren; }} Im Vergleich zur Aktualisierung der Produktkategorien gibt es nur einen weiteren Bild -Upload -Betrieb mit dem Bild. Wir müssen hochgeladene Bilder im Hintergrund verarbeiten. Wir werden im nächsten Artikel die Funktion der Datei -Upload -Funktion von Struts2 ausführlich analysieren.
Das obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, es wird für das Lernen aller hilfreich sein und ich hoffe, jeder wird Wulin.com mehr unterstützen.