Heim  >  Artikel  >  Web-Frontend  >  Teilen von Anwendungsbeispielen der JS-Komponente Bootstrap Table

Teilen von Anwendungsbeispielen der JS-Komponente Bootstrap Table

高洛峰
高洛峰Original
2017-01-04 11:08:021673Durchsuche

Ich habe gelernt, Bootstrap-Tabellen beim Paginieren des Clients zu verwenden. Mit Hilfe meiner Freunde habe ich das Dokument http://bootstrap-table.wenzhixin.net.cn/examples/ gefunden. Begrenzung der Anzahl von Datensätzen pro Seite. und Offset der Startanzahl der Datensätze.
Starten Sie das Paket, teilen Sie meinen Code, rufen Sie die Seitenzahl und die Seiten aus der Bootstrap-Tabelle ab und übergeben Sie sie an die Hintergrundverarbeitung.

$('#table').bootstrapTable({
  url: &#39;<%=path%>/FeedList.cqzk&#39;,
  striped: true,
  pagination: true,
  pageList: [3,5,20],
  pageSize:3,
  pageNumber:1,
  sidePagination:&#39;server&#39;,//设置为服务器端分页
  columns: [{
  field: &#39;title&#39;,
  title: &#39;标题&#39;
  }, {
  field: &#39;creatTime&#39;,
  title: &#39;时间&#39;
  } ]
 });
 
 
 
 @RequestMapping(value = "/FeedList.cqzk")
 @ResponseBody
 public String url_ad1(HttpServletRequest request,BootPage page) 
  throws ServletException,IOException,RuntimeException{
  
 @SuppressWarnings("unchecked") 
// List<Feedback> list = feedBackDao.find("from Feedback");
 BootPage pager = feedBackDao.getByPage("from Feedback",page,null);
 System.out.println((JSONArray.fromObject(pager)).getString(0).toString());
 return (JSONArray.fromObject(pager)).getString(0).toString(); 
 // 不写.getString(0) 就多一个中括号,返回的就是数组,写了就是返回第一个对象。
 }
  
 
 
public BootPage getByPage(String hql,BootPage pager,Map<String, Object> condition){
 if (pager == null) {
  throw new IllegalArgumentException("分页 不能为空!");
 }
 
 Query q = sessionFactory.getCurrentSession().createQuery(hql);
 q.setFirstResult(pager.getOffset());
 q.setMaxResults(pager.getLimit());
 
 if (condition != null) {
  q.setProperties(condition);
 }
 pager.setRows(q.list());
 pager.setTotal(this.countAll(hql, condition));
 return pager;
  
 }
 protected Long countAll(String hql, Map<String, Object> condition) {
 if (hql == null) {
  return 0l;
 }
 String tmpHql = hql.toLowerCase();
 String regex = hql.substring(0, tmpHql.indexOf("from"));
 hql = hql.replaceFirst(regex, "select count(*) ");
 Query q = sessionFactory.getCurrentSession().createQuery(hql);
 if (condition != null) {
  q.setProperties(condition);
 }
 return (Long) q.uniqueResult();
 }
 
 
public final class BootPage<T> {
  
 protected Long total;
  
 protected List<T> rows;
  
 protected int limit=0;
  
 protected int offset = 0;
  
 protected String order ="asc" ;
Die oben beschriebene Anleitung zur Verwendung von Bootstrap Table wird Ihnen hoffentlich dabei helfen, die Verwendung von Bootstrap Table zu beherrschen.

Weitere Anwendungsbeispiele für die Bootstrap-Tabelle der JS-Komponente zum Teilen verwandter Artikel finden Sie auf der chinesischen PHP-Website!


Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn