bootstrapTable + Java servlet

Java【JDK 1.6.0_13】

web.xml

  <servlet>
    <servlet-name>NoticeSelect</servlet-name>
    <servlet-class>NoticeSelect</servlet-class>
  </servlet>
  <servlet-mapping>
    <servlet-name>NoticeSelect</servlet-name>
    <url-pattern>/NoticeSelect</url-pattern>
  </servlet-mapping>

entity

public class Mynotice {
    /*编号,标题,内容*/
    private String noId,notitle,nocontent;

    @Override
    public String toString() {
        return "Mynotice [noId=" + noId + ", nocontent=" + nocontent
                + ", notitle=" + notitle + "]";
    }

    public Mynotice() {
        super();
    }

    public Mynotice(String noId, String notitle, String nocontent) {
        super();
        this.noId = noId;
        this.notitle = notitle;
        this.nocontent = nocontent;
    }

    public String getNoId() {
        return noId;
    }
    public String getNotitle() {
        return notitle;
    }
        public String getNocontent() {
        return nocontent;
    }
    public void setNotitle(String notitle) {
        this.notitle = notitle;
    }
        public void setNoId(String noId) {
        this.noId = noId;
    }
    public void setNocontent(String nocontent) {
        this.nocontent = nocontent;
    }
}

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;
//gson包
import com.google.gson.GsonBuilder;

//实体类
import Mynotice;
//操作数据库的类
import ConDao;


@SuppressWarnings("serial")
public class NoticeSelect extends HttpServlet {

    @Override
    protected void service(HttpServletRequest req, HttpServletResponse res)
            throws ServletException, IOException {
        //查出所有数据  返回道 List 集合中  由于ConDao类中的SelectAll方法使用了反射  以至于  all 无需使用泛型 
        List all = new ConDao().SelectAll(null,Mynotice.class);
        //设置为Json类型输出
        res.setContentType("text/json;charset=utf-8");
        //将   all 数组    以  json 形式  out
        String json = new GsonBuilder().setDateFormat("yyyy-MM-dd").create().toJson(all);
        PrintWriter out = res.getWriter();
        out.println(json);
        System.out.println(json);
        out.flush();
        out.close();
    }
}

Html:

<!DOCTYPE html>
<html lang="zh-CN">
  <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
     <title> bootstrapTable </title>
<!-- 必要css包 -->    <link rel="stylesheet" href="css/bootstrap.min.css"> <link rel="stylesheet" href="css/bootstrap-theme.min.css"> </head> <body> <table class="table table-striped table-hover" id="NoticeTable"> </table> <input type="button" value="清空" onclick="dele()"/> <input type="button" value="加载" onclick="NoticeSele()"/>

<!-- 必要js包 --> <script src="js/jquery-1.10.2.js"></script> <script src="js/bootstrap.min.js"></script> <script src="js/bootstrap-table.js"></script> <script src="js/bootstrap-table-zh-CN.js"></script> <script> function NoticeSele(){ $("#NoticeTable").bootstrapTable('destroy'); //用于将table销毁,如果不用【则会保留上次加载的内容】 $("#NoticeTable").bootstrapTable({ url:"NoticeSelect", method:"get", columns:[ {title:"公告标题",field:"notitle"}, {title:"操作",field:"", formatter:function(value,row,index){return "<a href=\"JavaScript:NoticeSeID('"+row["noId"]+"')\">查看</a>";} } ] }) } function NoticeSeID(id){ alert(id); } function dele(){ $("#NoticeTable").html(""); } </script> </body>
 

自行参考 必要文件,自行百度搜索下载


官方文档地址:http://bootstrap-table.wenzhixin.net.cn/zh-cn/documentation/

猜你喜欢

转载自www.cnblogs.com/huishaoKH/p/9833898.html