2017-03-19 2 views
0

을 변경은 열 중 하나는 드롭 다운 메뉴입니다 어디 <a href="http://bootstrap-table.wenzhixin.net.cn/" rel="nofollow noreferrer">bootstrap-table</a>을 사용하고 이전 행

$('#table').bootstrapTable('append', { 
    id: newId, 
    type: '<select name="type" class="select-type"><option value="foo">foo</option><option value="bar">bar</option></select>' 
    }) 

이전 행에서 선택한 option이 저장되지 않습니다.

Demo

업데이트 : 내 대답의 방법은 작은 테이블 잘 작동하지만, 100 + 행의 테이블에서 사용하면 지독하게 느린, 그래서 난 아직 해결책을 찾고 있어요.

답변

0

옵션을 선택한 후 값을 업데이트하기 위해 부트 스트랩 테이블의 api를 사용하는 이벤트 수신기를 추가했습니다.

$('#table').on('change', '.select-type', function(eventt) { 
    const elem = eventt.target; 
    elem[elem.selectedIndex].setAttribute('selected', true); 
    const tr = elem.parentNode.parentNode; 
    const rowId = tr.getAttribute("data-uniqueId"); 
    const row = $('#table').bootstrapTable('getRowByUniqueId', rowId); 
    row['type'] = elem.outerHTML; 
    $('#table').bootstrapTable('updateByUniqueId', [{id: rowId, row: row}]); 
});