Di bagian sebelumnya, kami selesai menggunakan Datagrid untuk menampilkan semua informasi produk. Di bagian ini, kami mulai menambahkan beberapa fungsi: Tambah, Perbarui, Hapus, dan Permintaan. Pertama, kami mengimplementasikan tampilan di meja depan, dan kemudian melakukan latar belakang untuk mendapatkan data.
1. Implementasi foreground penambahan, memperbarui, menghapus dan meminta fungsi
Ada properti toolbar di kontrol datagrid, yang menambahkan toolbar. Kami dapat menambahkan tombol -tombol ini ke properti toolbar untuk mencapai fungsi yang sesuai. Pertama -tama mari kita lihat definisi dokumentasi resmi tentang toolbar:
Kami menggunakan array untuk menentukan toolbar dan menambahkan kode berikut ke halaman kueri.jsp:
<%@ page language = "java" import = "java.util.*" pageencoding = "utf-8"%> <! Doctype html public "-// w3c // dtd html 4.01 transisi // en"> <html> <head> <%@ termasuk file = "/head.jsp." {html> <head> <%@ certakan file = "/head.jsp." {html> <head> <%@ termasuk file = "/public.jsp." {html> <head> <%@ incled File = "/public. 1px; } .searchbox {margin: -3; } </style> <script type = "text/javascript"> $ (function () {$ ('#dg'). datagrid ({// Ubah alamat url untuk meminta URL kategori: 'kategori_queryjogninAccount. Per halaman, defaultnya adalah 10 halaman: 5, // Atur jumlah opsional per halaman untuk pemilihan pengguna, standarnya adalah 10,20,30,40 ... Pagelist: [5,10,15,20], IDFIELD: 'ID', // Tentukan ID sebagai bidang Identifikasi, yang tidak bermanfaat ketika menghapus dan memperbarui jika Anda mengkonfigurasi bidang ini, Halaman/ *************************************/ Toolbar: [{iconCls: 'Icon-Add', Teks: 'Tambah Kategori', Handler: Function () {ALERT ('-Tambahkan Kategori-'); Kategori-- ');}},'-', {iconCls:' Icon-Remove ', Teks:' Hapus Kategori ', Handler: Function () {// Apakah ada catatan baris yang dipilih, gunakan getSelection untuk mendapatkan semua baris yang dipilih var baris = $ ("#dg"). DataGrid ("getSelections"); // Kembalikan baris yang dipilih, jika tidak ada baris yang dipilih, kembalikan array kosong IF (baris. } else {// minta apakah akan mengonfirmasi penghapusan. Jika dikonfirmasi, jalankan logika penghapusan $ .messager.confirm ('hapus dialog konfirmasi', 'apakah Anda yakin ingin menghapus item ini?', Function (r) {if (r) {// Keluar operasi; peringatan ("-hapus operasi--")}}); }}}}, '-', {// Tombol kueri bukan linkbutton, memiliki sintaks, tetapi juga mendukung Parsing HTML Tag Text: "<Input ID = 'SS' Name = 'SS' NAME = 'SS' />"}], // Konversi kotak teks Pencarian Query (SS '(SS' (SS '(SS'). pencari: fungsi (nilai, nama) {// nilai mewakili nilai yang dimasukkan // operasi kueri}, prompt: 'Harap masukkan kata kunci pencarian' // display default}); / **************************************************************/}); </script> </head> <body> <Table id = "dg"> </able> </body> </html>Dengan cara ini, kami telah mengatur kerangka kerja latar depan untuk menambah, memperbarui, menghapus, dan menanyakan. Sekarang dapat ditampilkan di latar depan. Tidak ada data yang datang di latar belakang, hanya kotak cepat muncul, tetapi fungsi tampilan telah selesai. Mari kita lihat efeknya:
Selanjutnya, kami akan menyelesaikan fungsi yang sesuai satu per satu.
2. Implementasi kueri kategori datagrid
Implementasi kueri adalah yang paling sederhana. Masukkan kata kunci di kotak pencarian, lalu lewati kata kunci sebagai parameter untuk tindakan, dan kemudian layanan mengeluarkan data dari database, mengemasnya ke dalam format JSON dan meneruskannya ke meja depan untuk ditampilkan. Proses ini sama dengan informasi produk yang ditampilkan sebelumnya. Kami hanya perlu menambahkan kode untuk bagian pencarian di JSP di atas, dan tidak perlu mengubah kode lain. Kode yang ditambahkan adalah sebagai berikut:
// Konversi kotak teks biasa menjadi kotak teks pencarian kueri $ ('#ss'). Searchbox ({// memicu pencari acara kueri: fungsi (nilai, nama) {// nilai mewakili nilai input // waspada (nilai + "," + name) // Dapatkan kata kunci dari kueri saat ini, memuat informasi yang sesuai melalui DataGrid, dan Use, dan Usery, Acara, dan PAVIONAL. Ganti atribut 'QueryParams.Metode pemuatan dapat memuat semua baris pada halaman pertama. Itu memiliki parameter. Jika ditentukan, itu akan membawa queryparams dengannya. Jika tidak, parameter yang ditentukan oleh queryparams di atas dilewatkan secara default. Di sini kami menetapkan tipe ke nilai nilai, yaitu, kata kunci kueri yang dimasukkan oleh pengguna, dan kemudian meneruskannya ke tindakan. Latar belakang pencarian dalam database berdasarkan nilai yang dimasukkan oleh pengguna dan mengembalikannya ke latar depan. Hasil eksekusi adalah sebagai berikut:
Dengan cara ini, saya menyelesaikan fungsi pencarian, yang relatif sederhana.
3. Implementasi Penghapusan Kategori Datagrid
Sekarang mari kita terapkan fungsi Hapus. Dari JSP di atas, kita dapat melihat bahwa sebelum dihapus, kami menentukan apakah pengguna telah memilih catatan. Jika tidak, kami akan memberi pengguna prompt. Jika dipilih, jendela pop-up akan memungkinkan pengguna untuk mengonfirmasi. Jika itu benar, fungsi DELETE akan dieksekusi. Ada detail yang perlu diperhatikan. Jika Anda ingin menghapus beberapa catatan sekaligus, properti Singleselect di atas harus diatur ke false.
Pertama, kami telah melengkapi kode yang dihapus di query.jsp di atas, lihat di bawah:
{iconcls: 'Icon-Remove', Teks: 'Hapus Kategori', Handler: Function () {// menilai apakah ada catatan baris yang dipilih, gunakan getSelection untuk mendapatkan semua baris yang dipilih var baris = $ ("#dg"). DataGrid ("getSelection"); // Kembalikan baris yang dipilih, jika tidak ada baris yang dipilih, kembalikan array kosong IF (baris. } else {// minta apakah akan mengonfirmasi penghapusan. Jika dikonfirmasi, logika penghapusan dieksekusi $ .messager.confirm ('hapus dialog konfirmasi', 'apakah Anda yakin ingin menghapus item ini?', Function (r) {if (r) {// 1. Dapatkan ID yang sesuai dari catatan yang diperoleh, nada nilai ID, dan kemudian kirim latar belakang 1,2 ID. ++) {IDS += Baris [i] .id +","} IDS = IDS.Substr (0, IDS.LastIndexof (",")); Operasi Pembaruan Selanjutnya $ ("#DG"). DataGrid ("Uncreckall"); Exception ', MSG:' Hapus Gagal, silakan periksa operasi ', Timeout: 2000, ShowType:' Slide ',}); }}}}}}} Jika pengguna memilih untuk menghapus, kotak dialog pertama -tama akan muncul. Ketika pengguna menentukan bahwa dia ingin menghapus, pertama -tama kita perlu mendapatkan ID produk yang dipilih oleh pengguna, menyambungkan ID ini ke dalam string, dan kemudian mengirim permintaan AJAX ke latar belakang. Parameter pertama dalam $ .post dikirim ke tindakan itu, parameter kedua adalah parameter yang dikirim, dan parameter ketiga adalah fungsi callback, yaitu, setelah penghapusan berhasil, metode dalam fungsi dijalankan. Hasil parameter fungsi ditransmisikan dari latar belakang, dan parameter keempat adalah opsional, yang merupakan jenis data pengembalian. Mari kita fokus pada konten di $ .post. Ketika latar belakang mengembalikan "benar" untuk menunjukkan bahwa penghapusan berhasil, maka kami memanggil metode Reload di Datagrid untuk menyegarkan halaman. Reload sama dengan beban yang digunakan dalam kueri sebelumnya. Perbedaannya adalah bahwa reload tetap pada halaman saat ini setelah menyegarkan, sedangkan beban menampilkan halaman pertama.
Oke, bagian halaman front-end ditulis. Selanjutnya, lengkapi metode yang sesuai di latar belakang. Pertama, tambahkan metode deletebyIds di CategoryService dan mengimplementasikan metode dalam kelas implementasinya CategoryServceImpl:
// CategoryService Antarmuka Antarmuka Publik CategoryService Memperluas BaseService <Petegory> {// Informasi Kategori Kueri, Daftar Publik Administrator Cascading <Gategory> QueryJoINAccount (Jenis String, Halaman int, ukuran int); // query Nama kategori // query Total jumlah catatan berdasarkan kata kunci public long getCount (string type); // hapus beberapa catatan berdasarkan IDS public void deletebyIds (ID string); } // CategoryServiceImpl Class Implementasi @SuppressWarnings ("Uncecked") @Service ("CategoryService") Kelas Publik CategoryServiceImpl memperluas BASESERVICEIMPL <Kategori> Menerapkan Kategori {Metode Public. = "hapus dari kategori C di mana c.id in (" + ids + ")"; getSession (). Createqueery (HQL) .ExecuteUpdate (); }} Setelah menulis bagian layanan, kami akan mulai menulis bagian aksi. Karena kami ingin mendapatkan data IDS yang dikirimkan dari meja depan, harus ada variabel dalam tindakan yang mengimplementasikan metode GET dan Atur untuk menerima data ini. Selain itu, kita perlu meneruskan hasilnya ke meja depan. Ketika kami melakukan kueri cascading di bab sebelumnya, metode yang digunakan adalah untuk mengepak data hasil kueri ke dalam format JSON dan meneruskannya ke meja depan, sehingga peta diperlukan, dan kemudian peta dikonversi ke dalam format JSON melalui file konfigurasi. Di sini, data yang kami lewati ke meja depan relatif sederhana. Jika kita berhasil menghapus saham, kita bisa melewati "benar" jadi kita tidak perlu mengemasnya ke dalam format JSON. Kami mengirimkannya melalui streaming. Prinsipnya sama seperti sebelumnya. Perdana Menteri, kita harus memiliki objek aliran untuk menyimpan byte "benar", dan kemudian melalui konfigurasi, objek tersebut dialirkan ke meja depan. Kami masih menulis dua objek ini dalam basa, sebagai berikut:
@Controller ("BaseAction") @Scope ("Prototipe") Basa kelas publik <T> Memperluas ActionSupport mengimplementasikan permintaan, sessionAware, ApplicationAware, ModelDriven <T> {// Dapatkan ID untuk dihapus, harus ada metode get dan atur // Aliran digunakan untuk mengembalikan data ke teratas. Data ini diperoleh dengan struts dan kemudian ditransmisikan ke latar depan melalui bentuk aliran, jadi terapkan metode GET ke ID string yang dilindungi; InputStream InputStream yang dilindungi; // dihilangkan di bawah ...} Metode yang sesuai dalam kategori adalah sebagai berikut:
@Controller ("CategoryAction") @scope ("ProtoType") Kategori Public ClassAction memperluas basa <Gategory> {public string queryjoNaccount () {// dihilangkan ...} public string deletebyIds () {System.out.println (ids); CategoryService.deletebyIds (IDS); // Jika penghapusan berhasil, itu akan dieksekusi ke bawah. Kami meneruskan "true" ke latar depan dalam bentuk stream inputStream = bytearrayInputStream baru ("true" .getbytes ()); // simpan byte "true" ke dalam aliran inputStream "stream"; }} Selanjutnya, mari kita lihat konfigurasi yang sesuai di struts.xml:
<struts> <name konstan = "struts.devmode" value = "true"/> <package name = "shop" extends = "json-default"> <!-Jason-default mewarisi struts-default-> <Global-results> <results name = "aindex">/web-inf/Main/aindex.jsult </name hasil = "aindex">/web-inf/main/aindex.jsuls </clopance </results> </aindex ">/web-inf/main/aindex.jsult </name ucapan> </aindex">/web-inf/main/aindex.jsuls Dikonfigurasi di musim semi, karena harus diserahkan kepada manajemen pegas-> <action name = "Category_*" Method = "{1}"> <name hasil = "jsonmap" type = "json"> <!-dihilangkan-> </results name = "stream" input = "stream"> <!-dalam bentuk stream, type adalah stream-param = param = "stream"> <!-dalam bentuk stream, tipe adalah stream-param = param = "stream"> <!-dalam bentuk stream, type adalah-> <param name = "type =" stream "> <! Untuk ditransmisikan di ImputStream-> </RAEST> </chere> <action name = "Account_*" Method = "{1}"> <name hasil = "index">/index.jsp </result> </chere> <!-Digunakan untuk melengkapi aksi penerusan sistem, semua permintaan diberikan untuk mengeksekusi-> <action name = "send _* name = "Send">/Web-inf/{1}/{2} .jsp </result> </chere> </packing> </struts>Dengan cara ini, kami telah melakukan operasi penghapusan dan melihat efeknya:
Setelah tes berhasil, kami juga dapat memilih beberapa item untuk dihapus sekaligus. Pada titik ini, fungsi penghapusan selesai.
Alamat asli: http://blog.csdn.net/eson_15/article/details/51338991
Di atas adalah semua konten artikel ini. Saya berharap ini akan membantu untuk pembelajaran semua orang dan saya harap semua orang akan lebih mendukung wulin.com.