2017-02-28 50 views
0

toget選定值我創建了從數據填充的自舉表,我希望能夠顯示當用戶點擊「獲取選擇」按鈕,用戶檢查的值舉表代如何從表

如何我能得到所選的名稱值嗎?

這裏是我的FIDDLE和代碼下面

<table id="table" data-toggle="table" data-side-pagination="server" data-click-to-select="true"> 
    <thead> 
    <tr> 
    <th data-field="state" data-checkbox="true"></th> 
     <th data-field="name">Name</th> 
     <th data-field="stargazers_count">Stars</th> 
     <th data-field="forks_count">Forks</th> 
     <th data-field="description">Description</th> 
    </tr> 
    </thead> 
</table> 
     <fieldset> 
     <input id="getSelected" type="button" value="Get Selected" /> 
     <input id="selectAll" type="button" value="Select All" /> 
     <input id="clear" type="button" value="Clear Selection" /> 
     </fieldset> 

回答

0

你需要做的,當行selected/unchecked上只是一個基本的檢查: fiddle

這裏的更新,JS:

var data = [ 
    { 
     "name": "bootstrap-table", 
     "stargazers_count": "526", 
     "forks_count": "122", 
     "description": "An extended Bootstrap table with radio, checkbox, sort, pagination, and other added features. (supports twitter bootstrap v2 and v3) " 
    }, 
    { 
     "name": "multiple-select", 
     "stargazers_count": "288", 
     "forks_count": "150", 
     "description": "A jQuery plugin to select multiple elements with checkboxes :)" 
    }, 
    { 
     "name": "bootstrap-show-password", 
     "stargazers_count": "32", 
     "forks_count": "11", 
     "description": "Show/hide password plugin for twitter bootstrap." 
    }, 
    { 
     "name": "blog", 
     "stargazers_count": "13", 
     "forks_count": "4", 
     "description": "my blog" 
    }, 
    { 
     "name": "scutech-redmine", 
     "stargazers_count": "6", 
     "forks_count": "3", 
     "description": "Redmine notification tools for chrome extension." 
    } 
]; 

$(function() { 
    $('#table').bootstrapTable('load', {total: 5, rows: data}); 
    checkedRows = []; 
    $('#table').on('check.bs.table', function (e, row) { 
    checkedRows.push({name: row.name, stargazers_count: row.stargazers_count, forks_count: row.forks_count, description: row.description}); 
    console.log(checkedRows); 
}); 

$('#table').on('uncheck.bs.table', function (e, row) { 
    $.each(checkedRows, function(index, value) { 
    if (value.name === row.name) { 
     checkedRows.splice(index,1); 
    } 
    }); 
    console.log(checkedRows); 
}); 

    $('#getSelected').click(function() { 
    console.log(checkedRows); 
    }) 
}); 
+0

謝謝您。如何清除已選中的選項或何時使用全選按鈕來獲取所有選中的值 – user244394