현재 행에 클릭하면 해당 행의 데이터가 텍스트 상자 및 선택 상자로 출력되는 jQuery Datatable이 있습니다. 텍스트 상자에 입력 된 내용이 무엇이든지간에 세이버 버튼을 누르면 선택한 행에 저장/입력됩니다. JSFiddlejQuery Datatable, 선택한 행의 열에 텍스트 상자의 값 출력
자바 스크립트 :
가 여기 내 JSFiddle 년대 saverow 코드와
var table = $('#example').DataTable();
(function() {
var table = document.querySelector('#example');
var name = document.querySelector('#nameinput');
var format = document.querySelector('#formatinput');
var address = document.querySelector('#addressinput');
var report = document.querySelector('#reportinput');
var alarm = document.querySelector('#alarminput');
table.addEventListener('click', onTableClick);
function onTableClick (e) {
var tr = e.target.parentElement;
var data = [];
for (var td of tr.children) {
data.push(td.innerHTML);
}
name.value = data[0];
address.value = data[1];
format.value = data[2];
report.value = data[3];
alarm.value = data[4];
console.log(alarm.value);
}
$("#saverow").click(function() {
var table1 = $('#data-table').DataTable();
var data = [];
data[0] = name.value;
data[4] = alarm.value;
console.log(name.value);
console.log(alarm.value);
table1.draw(true);
});
})();`
, 나는 다음 텍스트 상자의 값으로 열을 동일하게 만들려고 노력 테이블이 일하는 것이 다시 그리기로 생각했다. 텍스트 상자에 새로운 내용을 입력 한 다음 저장을 누르면 콘솔에 올바른 결과가 표시됩니다. 나는 단지 그것을 선택한 행에 다시 넣는 방법을 이해할 수 없다. 가능한 경우 인라인 편집을하고 싶지 않습니다. 이 형식으로 유지하려고합니다.
테이블과 데이터 테이블을 다른 배열로 설정하는 방법은 무엇입니까? 결국 테이블에는 데이터베이스의 데이터가 채워집니다. –
그리고 어떻게 행을 참조합니까, 질문에 대해 유감스럽게 생각합니다. 코딩에 익숙하지 않습니다. –
@ J.Doe43이 링크, 특히 예제 섹션을 확인하십시오. https://datatables.net/reference/api/row) .data() - 아마도 datatables.net 문서를 보면서 많은 것을 알 수있을 것입니다. 내가 생각한 한 가지 사실은 전체 테이블에 클릭 이벤트를 넣었다는 것입니다. 링크에있는 예제에서 볼 수 있듯이 행에 넣고 싶을 때 –