學(xué)習(xí)bootstrapTable 一直沒有找到 單選框的選定的和取值的教程,今天寫一個(gè).作為筆記
目前創(chuàng)新互聯(lián)公司已為數(shù)千家的企業(yè)提供了網(wǎng)站建設(shè)、域名、網(wǎng)頁空間、網(wǎng)站托管運(yùn)營(yíng)、企業(yè)網(wǎng)站設(shè)計(jì)、靈丘網(wǎng)站維護(hù)等服務(wù),公司將堅(jiān)持客戶導(dǎo)向、應(yīng)用為本的策略,正道將秉承"和諧、參與、激情"的文化,與客戶和合作伙伴齊心協(xié)力一起成長(zhǎng),共同發(fā)展。
1. 效果圖: 點(diǎn)擊 bootstrapTable 單選的按鈕, 選中該列, 取到該列的所有值.
2. js 代碼 : bootstrapTable 初始化
a. 注意:
singleSelect : true, // 單選checkbox columns : [ { checkbox: true } ] // bootstrapTable 顯示單選checkbox 列
$().ready(function() { // bootstrapTable 表格數(shù)據(jù)初始化 var table = $('#item_info_table').bootstrapTable({ url : '<c:url value='/item/entry/main_info/list_data'/>', method : 'POST', // GET uniqueId : 'id', // 綁定ID toolbar : '#item_info_toolbar', // 搜索框綁定 search : true, // 搜索框 pagination : true, // 顯示頁碼等信息 singleSelect : true, // 單選checkbox showRefresh : true, // 顯示刷新按鈕 showColumns : true, // 選擇顯示的列 pageSize : pageSize, // 當(dāng)前分頁值 pageList : pageList, // 分頁選頁 dataType : dataType, // JSON sidePagination : sidePagination, // 服務(wù)端請(qǐng)求 buttonsAlign : buttonsAlign, // 刷新,顯示列按鈕位置 toolbarAlign : toolbarAlign, // 搜索框位置 columns : [ { checkbox: true }, { title : '項(xiàng)目序號(hào)', field : 'itemNum', align : 'center', formatter:function(value,row,index){ var url = ''; if (isSingleItem(value)) url = '<a href="#" mce_href="#" onclick="single_item_edit_fun(\'' + row.infoId + '\')">' + row.itemNum + '</a> '; if (isJoinItem(value)) url = '<a href="#" mce_href="#" onclick="join_item_edit_fun(\'' + row.infoId + '\')">' + row.itemNum + '</a> '; return url; } }, { title : '項(xiàng)目名稱', field : 'itemName', align : 'center' } ] }); /********** bootstrapTable toolbar 按鈕事件 *********/ // [新增] 按鈕點(diǎn)擊事件 $('#item_info_btn_add').click(function(){ $('#item_info_modal').modal('show'); }); // [項(xiàng)目立項(xiàng)] 按鈕點(diǎn)擊事件 $('#item_info_btn_do').click(function(){ var selectContent = table.bootstrapTable('getSelections')[0]; if(typeof(selectContent) == 'undefined') { toastr.warning('請(qǐng)選擇一列數(shù)據(jù)!'); return false; }else{ console.info(selectContent); $('#item_project_modal').modal('show'); // 項(xiàng)目立項(xiàng)面板 } }); });
3. bootstrapTable url : '<c:url value='/item/entry/main_info/list_data'/>',
后臺(tái)json數(shù)據(jù)
注意. 第一個(gè)圖片中的 chrome F12 中的 Object 就是selectContent =table.bootstrapTable('getSelections')[0] 中的數(shù)據(jù)了 這樣我們就能取到 bootstrap 單選框 選擇 一行的 數(shù)據(jù).
{ "offset":10, "rows": [ { "infoId":"main_info_1111", "itemName":"AAA項(xiàng)目組", "itemNum":"JXY160909011S" }, { "infoId":"main_info_2222", "itemName":"BBB項(xiàng)目組", "itemNum":"JXY160909012F" } ], "total":10 }
以上所述是小編給大家介紹的BootStrapTable 單選及取值的實(shí)現(xiàn)方法,希望對(duì)大家有所幫助,如果大家有任何疑問請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)創(chuàng)新互聯(lián)網(wǎng)站的支持!
文章題目:BootStrapTable單選及取值的實(shí)現(xiàn)方法
標(biāo)題鏈接:http://m.newbst.com/article20/ppisco.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)頁設(shè)計(jì)公司、標(biāo)簽優(yōu)化、網(wǎng)站排名、微信公眾號(hào)、定制網(wǎng)站、靜態(tài)網(wǎng)站
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)