twbsPaginationの実装が出来ました。
ボタン押下⇒onclickでjsのfunctionキック⇒document.getElementByIdで検索項目を拾い上げる⇒拾い上げた値を配列にまとめる
$.post(
‘呼びたいservlet’,
さっき作った配列, //呼んだ先のdoPost内で値取れる
function(data){
//このdataにservletが返してくる値が入ってくる
//それを利用してpaginationを表示
そんで、簡単なサンプルを見て作ります。servletからtotalpagesに設定するページ数をもらえばいい。表示は簡単
var obj = $(‘#pagination’).twbsPagination({
totalpages: 取ってきた値,
visiblepages: 適当な値,
onPageClick: function(event. page){
//リスト書き換えのfunction呼ぶ?
}
みたいな書き方で簡単に出ます。
あっしが引っかかったのは、一度検索ボタンを押下して表示されると、検索項目を変えて再度押しても、最初のpaginationがそのまま居座る現象。
一旦むりくりtextContent = “”とかで消し去るとこんどは二度と出てこない。
日本語では有効な情報は見つかりませんでした。
仕方なく、英語ページで見つけた、
$pagination.twbsPagination(‘destroy’); $pagination.twbsPagination($.extend({}, defaultOpts, { startPage: currentPage, totalPages: totalPages }));
の表記。これじゃね?ってんで、自分のコードに当てはめてみました。
function kensaku(){
//alert(“呼ばれた”);
//画面のデータを記憶
var yakuhin_kbn = document.getElementById(“yakuhin_kbn”).value;
var date_from = document.getElementById(“date_from”).value;
var date_to = document.getElementById(“date_to”).value;
var torihikisaki = document.getElementById(“torihikisaki”).value;
var tenpo_code = document.getElementById(“tenpo_code”).value;
var yakuhin = document.getElementById(“yakuhin”).value;
var job = ‘1’; //入荷一覧総ページ数取得をしろっつうflg
var arrdata = {
“yakuhin_kbn” : yakuhin_kbn,
“date_from” : date_from,
“date_to” : date_to,
“torihikisaki” : torihikisaki,
“tenpo_code” : tenpo_code,
“yakuhin” : yakuhin,
“job” : job
};
$.post(
‘nyuka’,
arrdata,
function(data){
//alert(data);
var pagecount = data;
//このdestroyがミソ
$(‘#pagination’).twbsPagination(‘destroy’);
var obj = $(‘#pagination’).twbsPagination({
totalPages: pagecount,
visiblePages: 10,
onPageClick: function (event, page) {
console.info(page);
}
});
console.info(obj.data());
}
);
}
一度作ると居座ってしまうので、destroyしてから作る。
業務アプリなら検索をし直すなんて当たり前なので、この情報がなくて困ってた人多いんじゃないかな。。
などと思ってアップ。