ブートストラップ テーブルのサーバー側ページングの後、ページ番号をクリックするとテーブル全体が更新されます。テーブルを更新せずにデータのみを更新するにはどうすればよいですか?

Question

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

<thead>

<tr>

<th>番号</th>

<th>中文标题</th>

<th>出厂期</th>

<th>片長

主

<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>

< td></td>

</tr>

</tbody>

</table>

<script type="text/javascript">

$(function () {

$("html").niceScroll();

});

$("#table").bootstrapTable({ // テーブルタグに対応する ID

url: "json.php", //テーブル データを取得します。 url

method: 'post',

dataType: 'json',

cache: false, // AJAX データ キャッシュを無効にするには false に設定します。デフォルトは true です。

ストライプ: true, //テーブルにはストライプが表示されます。デフォルトは falseです。

pagination: true, //ページネーション コンポーネントはテーブルの一番下に表示されます。デフォルトは false

paginationLoop: true,

pageList: [10, 50, 100, 500], //ページに表示できるデータ項目の数を設定します

pageSize: 10, //ページデータ項目数

pageNumber: 1, //推奨ページ番号

search: true,

smartDisplay: false,

showRefresh: true,

sortName: 'pubtime',

sortOrder: 'desc',

sidePagination: 'server', // サーバーに設定-side paging

queryParams: function (params) { // サーバー データをリクエストするとき 送信されたパラメータについて、ここに追加のクエリ パラメータを追加できます。 false が返された場合、リクエストは終了します。

return {

pageSize: params.limit, //各ページに表示するデータ項目の数

sort: params.sort, // 並べ替えるフィールド

sortOrder: params.order, // 並べ替えルール

pageNumber: this.pageNumber,

search: this.searchText

}

} ,

columns: [{

field: 'fanhao',

title: 'number',

align: 'center',

valign: 'middle',

width: '150px',

sortable: true

}, {

field: 'cname' ,

title: '中国語タイトル',

align: 'center',

valign: 'middle',

sortable: true

}, {

field: '公開時刻',

title: '工場出荷日',

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 () { //ロード時に実行success

console.info("読み込み成功");

},

onLoadError: function () { //読み込み失敗時に実行

console .info("データのロードに失敗しました");

}

});

$("#table").bootstrapTable("更新", {

url: "json.php"

});

</ スクリプト>

Answer 1

コードが非常に疲れているように見えます。フォーマットしてコード ブロックで送信してみてはいかがでしょうか?

Ajax を使用してすべてのデータを取得してみてください