Im vorherigen Abschnitt haben wir DataGrid über die Anzeige aller Produktinformationen abgeschlossen. In diesem Abschnitt haben wir begonnen, mehrere Funktionen hinzuzufügen: Hinzufügen, Aktualisieren, Löschen und Abfragen. Zuerst implementieren wir die Anzeige in der Rezeption und machen dann den Hintergrund, um Daten zu erhalten.
1. Vordergrundimplementierung des Hinzufügens, Aktualisierens, Löschens und Abfragens von Funktionen
In der DataGrid Control befindet sich eine Symbolleiste, die die Symbolleiste hinzufügt. Wir können diese Schaltflächen in die Symbolleiste -Eigenschaft hinzufügen, um entsprechende Funktionen zu erzielen. Schauen wir uns zunächst die Definition der offiziellen Dokumentation der Symbolleiste an:
Wir verwenden Arrays, um die Symbolleiste zu definieren und den folgenden Code zur Seite query.jsp hinzuzufügen:
<%@ page Language = "java" import = "java.util. Rand: 1PX; } .searchbox {margin: -3; } </style> <script type = "text/javaScript"> $ (function () {$ ('#dg'). datagrid ({// die URL -Adresse ändern, um Kategorie -URL zu fordern: 'category_queryjoinaccount.Action', SingleSelect: False, wenn nur einzelne Leitung. Pro Seite beträgt der Standard 10 Seiten: 5, // Die optionale Anzahl der Datensätze pro Seite für die Benutzerauswahl festlegen, der Standardwert ist 10,20,30,40 ... Pagelist: [5,10,15,20], IDFIELD: 'ID', // ID angeben, da das Identifizierungsfeld nützlich ist, wenn Sie das Löschen und Aktualisierung des Austeils auf das Wenden des Seites haben. page/***************************************/ toolbar: [{ iconCls: 'icon-add', text:'Add category', handler: function(){ alert('--add category--'); } },'-',{ iconCls: 'icon-edit', text:'Update category', handler: function(){ alert('--update Kategorie-'); // Geben Sie die ausgewählte Zeile zurück, wenn keine Zeilen ausgewählt sind, geben Sie ein leeres Array zurück, wenn (Zeilen.length == 0) {// Die Eingabeaufforderung Meldung $ .Messager.Show ({// Die Syntax ist ähnlich wie bei statischen Methoden in Java. } else {// fordern Sie auf, ob die Löschung bestätigt werden soll. Wenn bestätigt, führen Sie die Logik des Löschens $ .Messager.Confirm aus ('Dialogfeld "Bestätigung löschen", "Sind Sie sicher, dass Sie dieses Element löschen möchten?", Funktion (r) {if (r) {// Operation; Alert ("-Betrieb löschen-")}}); }}}}, '-', {// Die Abfrage-Schaltfläche ist kein Linkbutton, es hat Syntax, aber es unterstützt auch das Parsen von HTML-Tag-Text: "<Eingabe id = 'ss' name = 'ss' name = ' Sucher: Funktion (Wert, Name) {// Wert repräsentiert den eingegebenen Wert // Abfrageoperation}, Eingabeaufforderung: 'Bitte geben Sie das Suchschlüsselwort' // Standardanzeige}); /*********** </script> </head> <body> <table id = "dg"> </table> </body> </html>Auf diese Weise haben wir ein Vordergrund -Framework zum Hinzufügen, Aktualisieren, Löschen und Abfragen eingerichtet. Jetzt kann es im Vordergrund angezeigt werden. Es gibt keine Daten im Hintergrund, nur eine Eingabeaufforderung Box wird angezeigt, aber die Anzeigefunktion wurde abgeschlossen. Schauen wir uns den Effekt an:
Als nächstes werden wir die entsprechenden Funktionen einzeln ausfüllen.
2. Implementierung der DataGrid -Kategorie -Abfrage
Die Abfrage -Implementierung ist die einfachste. Geben Sie das Schlüsselwort in das Suchfeld ein, übergeben Sie das Schlüsselwort als Parameter an die Aktion. Anschließend nimmt der Dienst die Daten aus der Datenbank heraus, packt es in das JSON -Format und übergibt es an die Rezeption zur Anzeige. Dieser Vorgang entspricht den zuvor angezeigten Produktinformationen. Wir müssen den Code nur für den Suchenteil in der obigen JSP hinzufügen, und es müssen nicht die anderen Codes geändert werden. Der hinzugefügte Code lautet wie folgt:
// Das ordentliche Textfeld in ein Abfrage -Suchtextfeld $ ('#ss') umwandeln. SearchBox ({// Auslösen Sie den Abfrageereignisereignis: Funktion (Wert, Name) {// Wert repräsentiert den Eingabwert // Alarm (Wert + "," + Name ". Ersetzen Sie das Attribut von Queryparams.Die Lastmethode kann alle Zeilen auf der ersten Seite laden. Es hat einen Parameter. Wenn angegeben, bringt es Queryparams mit. Andernfalls werden die von Queryparams oben genannten Parametern standardmäßig übergeben. Hier setzen wir den Typ auf den Wert des Wertes, dh das vom Benutzer eingegebene Abfrageschlüsselwort und übergeben ihn dann an die Aktion. Die Hintergrundsuche in der Datenbank basierend auf dem vom Benutzer eingegebenen Wert und gibt sie in den Vordergrund zurück. Die Ausführungsergebnisse sind wie folgt:
Auf diese Weise habe ich die Suchfunktion abgeschlossen, die relativ einfach ist.
3. Implementierung der DataGrid -Kategorie Löschung
Implementieren wir nun die Löschfunktion. Aus dem obigen JSP können wir sehen, dass wir vor dem Löschen feststellen, ob der Benutzer einen Datensatz ausgewählt hat. Wenn nicht, geben wir dem Benutzer eine Eingabeaufforderung. Wenn es ausgewählt ist, ermöglicht ein Popup-Fenster dem Benutzer zu bestätigen. Wenn es wahr ist, wird die Löschfunktion ausgeführt. Es gibt ein Detail zu beachten. Wenn Sie mehrere Datensätze gleichzeitig löschen möchten, sollte die obige SingleSelect -Eigenschaft auf false festgelegt werden.
Zunächst haben wir den in query.jsp gelöschten Code oben ergänzt, siehe unten:
{iconcls: 'icon-remove', text: 'kategorie delete', Handler: function () {// beurteilen, ob ausgewählte Zeilendatensätze vorhanden sind, verwenden Sie GetSelections, um alle ausgewählten Zeilen zu erhalten. // Geben Sie die ausgewählte Zeile zurück, wenn keine Zeilen ausgewählt sind, geben Sie ein leeres Array zurück, wenn (Zeilen.length == 0) {// Die Eingabeaufforderung Meldung $ .Messager.Show ({// Die Syntax ist ähnlich wie bei statischen Methoden in Java. } else {// fordern Sie auf, ob die Löschung bestätigt werden soll. Wenn dies bestätigt wird, wird die Logik des Deletions $ .Messager.Confirm ('Dialog "Bestätigen Sie bestätigen" ausgeführt. Sind Sie sicher, dass Sie dieses Element löschen möchten? ", Funktion (r) {if (r) {// 1. Holen Sie sich die entsprechende ID aus dem erhaltenen Datensatz, Splice der ID und dann senden Sie den Hintergrund 1,2,3,3,4 -IDS =". ++) {ids += Zeilen [i] .ID +"; Nachfolgende Aktualisierungsoperation $ ("#DG"). DataGrid ("Unerrecall"); MSG: 'Delete fehlgeschlagen, bitte überprüfen Sie die Operation', Timeout: 2000, ShowType: 'Slide',}); }}}}}}} Wenn der Benutzer zum Löschen wählt, wird zuerst ein Dialogfeld angezeigt. Wenn der Benutzer feststellt, dass er löschen möchte, müssen wir zunächst die vom Benutzer ausgewählte ID des Produkts erhalten, diese IDs in eine Zeichenfolge spleifen und dann eine AJAX -Anfrage an den Hintergrund senden. Der erste Parameter in $ .post wird an diese Aktion gesendet, der zweite Parameter ist der gesendete Parameter, und der dritte Parameter ist die Rückruffunktion, dh nachdem die Löschung erfolgreich ist, wird die Methode in der Funktion ausgeführt. Das Parameterergebnis der Funktion wird aus dem Hintergrund übertragen, und der vierte Parameter ist optional, was die Art der Rückgabedaten ist. Konzentrieren wir uns auf den Inhalt in $ .post. Wenn der Hintergrund ein "True" zurückgibt, um anzuzeigen, dass die Löschung erfolgreich ist, nennen wir die Reload -Methode in DataGrid, um die Seite zu aktualisieren. Das Nachladen entspricht der Last, die in der vorherigen Abfrage verwendet wird. Der Unterschied besteht darin, dass das Nachladen nach dem Aktualisieren auf der aktuellen Seite bleibt, während das Lade die erste Seite anzeigt.
Okay, der Front-End-Seitenteil ist geschrieben. Vervollständigen Sie als nächstes die entsprechende Methode im Hintergrund. Fügen Sie zunächst die Methode DeleteByIDs in den Kategorieservice hinzu und implementieren Sie die Methode in der CategoryServceImpl in der Implementierung:
// CategoryService Interface Public Interface CategoryService erweitert BaseSeService <kategorie> {// Abfragen Kategorieinformationen, Kaskadierungsadministrator Public List <Gategorie> queryJoinAccount (String -Typ, int Seite, int -Größe); // den Namen der Kategorie abfragen // Die Gesamtzahl der Datensätze basierend auf Schlüsselwörtern öffentlich Long GetCount (String -Typ); // Mehrere Datensätze löschen basierend auf IDs Public void DeleteByIds (String -IDs); } // categoryServiceImpl -Implementierungsklasse @SuppressWarnings ("Unkontrolliert") @Service ("CategoryService") öffentliche Klassen -Kategorie -ServiceImpl erweitert BaseServiceImpl <category> implements categoryService {// Andere Methoden werden weggelassen und geschrieben. "Löschen aus Kategorie C, wobei c.id in (" + ids + ")"; GetSession (). CreateEquery (HQL) .executeUpdate (); }} Nach dem Schreiben des Service -Teils werden wir den Aktionsteil schreiben. Da wir die IDS -Daten von der Rezeption übertragen lassen möchten, muss in der Aktion eine Variable vorhanden sein, die die GET- und Festlegen der Methoden zum Empfangen dieser Daten implementiert. Außerdem müssen wir das Ergebnis an die Rezeption übergeben. Wenn wir im vorherigen Kapitel Abfragen durchführen, besteht die verwendete Methode darin, die Abfrageergebnisdaten in das JSON -Format zu verpacken und an die Rezeption weiterzugeben. Daher wird eine Karte benötigt, und dann wird die Karte über die Konfigurationsdatei in JSON -Format konvertiert. Hier sind die Daten, die wir an die Rezeption übergeben, relativ einfach. Wenn wir die Aktien erfolgreich löschen, können wir einfach ein "wahres" übergeben, damit wir sie nicht in das JSON -Format verpacken müssen. Wir übertragen es durch Streaming. Das Prinzip ist das gleiche wie zuvor. Premierminister, wir müssen ein Stream -Objekt haben, um die "wahren" Bytes zu speichern, und dann wird das Objekt durch die Konfiguration an die Rezeption gestreamt. Wir schreiben diese beiden Objekte immer noch wie folgt in Basreaktion:
@Controller ("Baseaction") @Scope ("Prototyp") Basisanlagen der öffentlichen Klasse <T> Erweitert ActionVortements -Implements RequestAware, SessionAware, ApplicationAware, modeldiven <t> {// Erhalten Sie die IDs, die gelöscht werden müssen. Diese Daten werden durch Streben erhalten und dann durch die Form eines Streams in den Vordergrund übertragen. Implementieren Sie daher die GET -Methode zu geschützten String -IDs. geschützter InputStream InputStream; // unten weggelassen ...} Die entsprechenden Methoden in der Kategorie sind wie folgt:
@Controller ("CategoryAction") @Scope ("Prototyp") öffentliche Klassenkategorie erweitert Baseacction <category> {public String queryJoinAccount () {// weggelassen ...} public String deleteByIds () {System.out.println (ids); categoryService.deletebyids (ids); // Wenn die Löschung erfolgreich ist, wird sie nach unten ausgeführt. Wir geben in Form eines Stream InputStream = New BytearrayInputStream ("true" .getBytes () "true" in den Vordergrund. // Speichern Sie die Bytes von "True" in den Stream InputStream -Rückgabe "Stream"; }} Schauen wir uns als nächstes die entsprechende Konfiguration in Struts.xml an:
<Struts> <Constant Name = "Struts.DevMode" value = "true"/> <package name = "shop" extends = "json-Default"> <!-Jason-Default erbt Struts-Default-> <global-results Konfiguriert im Frühjahr, weil es an Spring Management übergeben werden soll-> <Action name = "category_*" method = "{1}"> <result name = "jsonmap" type = "json"> <!-ausgelöst-> </result> <result name = "stream" type transmitted in the imputStream--> </result> </action> <action name="account_*" method="{1}"> <result name="index">/index.jsp</result> </action> <!-- Used to complete the action forwarding of the system request, all requests are handed to execute--> <action name="send_*_*"> <result name = "send">/webinf/{1}/{2} .jsp </result> </action> </package> </struts>Auf diese Weise haben wir den Löschvorgang durchgeführt und den Effekt sehen:
Nachdem der Test erfolgreich ist, können wir auch mehrere Elemente auswählen, die gleichzeitig gelöscht werden sollen. Zu diesem Zeitpunkt ist die Löschfunktion abgeschlossen.
Originaladresse: http://blog.csdn.net/eson_15/article/details/51338991
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.