日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當(dāng)前位置: 首頁 > 编程语言 > java >内容正文

java

java jquery_jQuery数据表和Java集成

發(fā)布時(shí)間:2023/12/3 java 38 豆豆
生活随笔 收集整理的這篇文章主要介紹了 java jquery_jQuery数据表和Java集成 小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.

java jquery

  • jQuery DataTables是一個(gè)開放源代碼插件,用于在瀏覽器中創(chuàng)建表。
  • 它具有許多功能,例如排序,服務(wù)器端處理, JQUERY UI主題滾動。
  • 該插件的下載鏈接:
  • http://www.datatables.net/download/

  • 在本演示中,我們展示了數(shù)據(jù)表與Java的集成。數(shù)據(jù)表將通過調(diào)用Ajax來加載所有數(shù)據(jù)來加載數(shù)據(jù)。
  • 響應(yīng)數(shù)據(jù)必須包含“ aaData”屬性。
  • 該演示的主要組件是:


  • 項(xiàng)目結(jié)構(gòu):

    與Java集成:

  • 靜態(tài)數(shù)據(jù)StudentDataService.java,
package com.sandeep.data.service;import java.util.ArrayList; import java.util.List; import com.sandeep.data.object.Student;public class StudentDataService {public static List<student> getStudentList() {List<student> listOfStudent = new ArrayList<student>();Student aStudent = new Student();for (int i = 1; i <= 200; i++) {aStudent = new Student();aStudent.setName('Sandeep' + i);aStudent.setMark('20' + i);listOfStudent.add(aStudent);}return listOfStudent;} }
  • 數(shù)據(jù)表對象將作為響應(yīng)傳遞到Servlet DataTableObject.java中,
  • package com.sandeep.data.object;import java.util.List;public class DataTableObject {int iTotalRecords;int iTotalDisplayRecords;String sEcho;String sColumns;List<student> aaData;public int getiTotalRecords() {return iTotalRecords;}public void setiTotalRecords(int iTotalRecords) {this.iTotalRecords = iTotalRecords;}public int getiTotalDisplayRecords() {return iTotalDisplayRecords;}public void setiTotalDisplayRecords(int iTotalDisplayRecords) {this.iTotalDisplayRecords = iTotalDisplayRecords;}public String getsEcho() {return sEcho;}public void setsEcho(String sEcho) {this.sEcho = sEcho;}public String getsColumns() {return sColumns;}public void setsColumns(String sColumns) {this.sColumns = sColumns;}public List<student> getAaData() {return aaData;}public void setAaData(List<student> aaData) {this.aaData = aaData;}}
  • 返回JSON作為String StudentDataServlet.java的Servlet ,
  • package com.sandeep.json.data.servlet;import java.io.IOException; import java.io.PrintWriter; import java.util.List; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import com.google.gson.Gson; import com.google.gson.GsonBuilder; import com.sandeep.data.object.DataTableObject; import com.sandeep.data.object.Student; import com.sandeep.data.service.StudentDataService;public class StudentDataServlet extends HttpServlet {private static final long serialVersionUID = 1L;public StudentDataServlet() {super();}protected void doGet(HttpServletRequest request,HttpServletResponse response) throws ServletException, IOException {response.setContentType('application/json');PrintWriter out = response.getWriter();List<Student> lisOfStudent = StudentDataService.getStudentList();DataTableObject dataTableObject = new DataTableObject();dataTableObject.setAaData(lisOfStudent);Gson gson = new GsonBuilder().setPrettyPrinting().create();String json = gson.toJson(dataTableObject);out.print(json);}protected void doPost(HttpServletRequest request,HttpServletResponse response) throws ServletException, IOException {doGet(request, response);}}
  • 帶有表元素文件ajaxDataTable.jsp的html文件,
  • <%@ page language='java' contentType='text/html; charset=ISO-8859-1'pageEncoding='ISO-8859-1'%> <!DOCTYPE html PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN' 'http://www.w3.org/TR/html4/loose.dtd'> <html> <head> <meta http-equiv='Content-Type' content='text/html; charset=ISO-8859-1'> <title>Ajax Data Response And JQuery data table</title><style type='text/css' title='currentStyle'>@import './resource/css/demo_table_jui.css';@import './resource/css/jquery-ui-1.9.2.custom.min.css'; </style> <style> .table-container{width:800px; } tr.odd{ background: #EDE4D4 !important; } tr.odd td.sorting_1{ background: #EDE4D4 !important; } tr.even td.sorting_1{ background: #fff !important; } </style> </head><body><div class='table-container'><table cellpadding='0' cellspacing='0' border='0' class='display jqueryDataTable'><thead><tr><th>Name</th><th>Mark</th></tr></thead><tbody></tbody></table></div><script src='./resource/js/jquery-1.8.3.min.js'></script><script src='./resource/js/jquery.dataTables.min.js'></script><script src='http://code.jquery.com/ui/1.9.2/jquery-ui.js'></script><script src='./resource/js/my-demo-table-script.js'></script></body> </html>
  • 用于初始化數(shù)據(jù)表my-demo-table-script.js的 Java腳本代碼,
  • $(document).ready(function() {$('.jqueryDataTable').dataTable( {'bProcessing': false,'bServerSide': false,'sAjaxSource': './StudentDataServlet','bJQueryUI': true,'aoColumns': [{ 'mData': 'name' },{ 'mData': 'mark' }]} ); } );

    輸出:

    集成表的輸出將是:

    視頻:


    下載演示代碼:
    演示代碼下載鏈接

    參考: My Small Tutorials博客上的JCG合作伙伴 Sandeep Kumar Patel提供的JQuery DataTables和Java Integration 。

    翻譯自: https://www.javacodegeeks.com/2013/02/jquery-datatables-and-java-integration.html

    java jquery

創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎(jiǎng)勵(lì)來咯,堅(jiān)持創(chuàng)作打卡瓜分現(xiàn)金大獎(jiǎng)

總結(jié)

以上是生活随笔為你收集整理的java jquery_jQuery数据表和Java集成的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò),歡迎將生活随笔推薦給好友。