<table id="table" data-toggle="table" >

<thead>

<tr>

<th>番号</th>

<th>中文标题</th>

<th>出厂期</th>

<th>片长</th>

<th>主题</th>

</tr>

</thead>

<tbody>

<tr>

<td></td>

<td></td>

<td></ td>

<td></td>

<td></td>

</tr>

<tr>

<td></td>

<td></td>

<td></td>

<td></td>

<td></td>

</tr>   <tr>

<td></td>

<td></td>

<td></td>

<td></td>

<td></td>

</tr>   <tr>

<td></td>

<td></td>

<td></td>

<td></td>

<td></td>

</tr>   <tr>

<td></td>

<td></td>

<td></td>

<td></td>

<td></td>

</tr>   <tr>

<td></td>

<td></td>

<td></td>

<td></td>

<td></td>

</tr>   <tr>

<td></td>

<td></td>

<td></td>

<td></td>

<td></td>

</tr>   <tr>

<td></td>

<td></td>

<td></td>

<td></td>

<td></td>

</tr>   <tr>

<td></td>

<td></td>

<td></td>

<td></td>

<td></td>

</tr>   <tr>

<td></td>

<td></td>

<td></td>

<td></td>

</tr> ;/table>

<script type="text/javascript">

$(function () {

$("html").niceScroll( );

});

$ ("#table").bootstrapTable({ // Die ID, die dem Tabellen-Tag entspricht

url: "json.php", // Die URL zum Abrufen der Tabellendaten

Methode: ' post',

dataType : 'json',

cache: false, //Auf false setzen, um das AJAX-Daten-Caching zu deaktivieren, der Standardwert ist true

striped: true, //Die Tabelle zeigt Streifen an, der Standardwert ist false

pagination: true , / / Zeigt die Paging-Komponente am Ende der Tabelle an, Standardeinstellung: false

paginationLoop: true,

pageList: [10, 50, 100, 500], // Legen Sie die Anzahl der Datenelemente fest, die auf der Seite angezeigt werden können

pageSize: 10, // Anzahl der Seitendaten

pageNumber: 1, // Empfohlene Seitenzahl

search: true,

smartDisplay: false,

showRefresh: true,

sortName: 'pubtime',

sortOrder: 'desc',

sidePagination: 'server', // Auf serverseitiges Paging setzen

queryParams: function (params) { // Parameter, die beim Anfordern von Serverdaten gesendet werden. Sie können hier zusätzliche Abfrageparameter hinzufügen. Geben Sie false zurück um die Anfrage zu beenden

return {

pageSize: params.limit, // Die Anzahl der Datenelemente, die auf jeder Seite angezeigt werden sollen

sort: params.sort, // Die zu sortierenden Felder

sortOrder: params. order, // Sortierregeln

pageNumber: this. pageNumber,

search: this.searchText

}

},

columns: [{

field: 'fanhao',

title: 'number',

align: 'center',

valign: 'middle',

width: '150px',

sortable: true

}, {

field: 'cname',

title: 'Chinesischer Titel' ,

align: 'center',

valign : 'middle',

sortable: true

}, {

field: 'pubtime',

title: 'factory date',

align: 'center ',

valign: 'middle',

width: '100px',

sortable: true

}, {

field: 'time',

title: 'length',

align: 'center ',

valign: 'middle',

width: '80px',

sortable: true

}, {

field: 'genre',

title: 'theme',

align: 'center ',

valign: 'middle',

width: '300px',

}],

onLoadSuccess: function () { //Wird ausgeführt, wenn der Ladevorgang erfolgreich war

console.info("Laden erfolgreich");

},

onLoadError: function () { //Ausführen, wenn das Laden fehlschlägt

console.info("Laden der Daten fehlgeschlagen");

}

});

$("#table").bootstrapTable ("aktualisieren",{

url: " json.php"

});

</script>