Bootstrap table and raster pagination examples _javascript tips

Stitching table Please run the following code directly: replace

Bootstrap.css jquery-1.12.3.min.js Bootstrap-paginator.min.js "

<! DOCTYPE html>  

Results

　

Attention

1,BOOTSTRAP3 page ID for #example must be UL tag, 2, in JS option in Bootstrapmajorversion:3

1,BOOTSTRAP2 page ID #example must be div tag, 2, in JS option Bootstrapmajorversion:2

The paging source code explains:

Extension instructions

Above I was stitching the form, you can splice into grid layout, is not more hanging?

Mosaic Grid Demonstration

$.each (eval ("+ Data +")). List, function (index, item) { 
$ ("#list"). Append (' <div class= col-sm-col-md-' data- Toggle= "modal" data-target= "#myModal" style= "Text-align:center;" >
<div class= "thumbnail" style= "HEIGHT:PX;" ><a href= "Javascript:return ()" >
</img></a> <div class=" caption
><a href= "Javascript:return ()" target= "_blank" > ' + item.title + ' <br><small>by @mdo </small > </a> 
 

background-Acquired data format

{"
PageCount": 2,
"CurrentPage": 1,
"list": [
{
"id":],
"title": "Printing public security Management Information System",
" Detail ":" Patent No.: ZL 222222 High efficiency, improve the quality of work. "
},
{"
id ":"
title ":" Key units visiting Personnel Management system ",
" detail ":" Patent No.: ZL 233-shaped, improve work efficiency, improve the quality of working. "
}
]

The above is a small set to introduce the bootstrap table and grid pagination Examples of detailed, I hope to help you, if you have any questions please give me a message, small series will promptly reply to everyone. Here also thank you very much for the cloud Habitat Community website support!