JQuery Datatables 새 행 추가

원하는 경우 20 명까지 다른 사람을 등록 할 수있는 등록 페이지를 만듭니다.JQuery Datatables 새 행 추가

<div id="tables"> 
    <table id="table" border="1"> 
     <thead> 
      <tr> 
       <th>First Name</th> 
       <th>Last Name</th> 
       <th>Email</th> 
      </tr> 
     </thead> 
    </table> 
</div> 

$('#reg_more').dataTable({ 
    "bLengthChange": false, 
    "bInfo": false 
});

지금 내가 추가 버튼을 넣어하려는 사용자가 입력 첫 번째 할 수 있도록하고이 내 HTML 테이블 내 JQuery와 DataTables의 초기화 데이터와

First Name: <br/><input type="text" name="fname" id="fname" /> <br/> 
Last Name: <br/><input type="text" name="lname" id="lname" /> <br/> 
Email: <br/><input type="text" name="email" id="email"/> <br/>

입니다 : 그래서 나는이 텍스트 상자를 성을 추가하고 이메일을 보내고 추가를 누르면 테이블에 추가됩니다. 어떻게해야합니까?

출처

2012-09-16 Richard

정확한 질문의 구글 검색합니다. 신속하게 알려주세요. https://www.google.com/search?q=JQuery+Datatables+Add+new+Row&rlz=1C1CHFX_enUS480US480&aq=f&sugexp=chrome,mod=8&sourceid=chrome&ie=UTF-8 –

@StephenSarcsamKamenar yah 그게 정확히 무엇입니까? 내가 게시하기 전에했는데 응답의 머리말이나 꼬리를 만들 수 없었습니다. 성공하지 못하게하는 몇 가지 해결책을 시도해 보았습니다. 그래서 내가 여기 와서 누군가 내가 이해할 수있는 해결책을 설명 할 수있게되었습니다. Google은 항상 내 첫 번째입니다. 옵션 – Richard

http://datatables.net/examples/api/add_row.html 도움이되지 않습니까? 그 중 어떤 부분에 문제가 있습니까? –

$(document).ready(function() { 
    $('#example').dataTable(); 
    $('#addbtn').click(addrow); 
}); 

function addrow() { 
    $('#example').dataTable().fnAddData([ 
     $('#fname').val(), 
     $('#lname').val(), 
     $('#email').val() ]); 

}

버튼 클릭시 addrow()를 호출해야합니다.

는 HTML 코드 여기

<input type="button" value="add" id="addbtn" />

출처

2012-09-16 03:56:30 Sutha

아, 훨씬 더 나은, 나는 jquery와 datatables에 새로운 브랜드이기 때문에 이런 종류의 작업을 수행하는 것은 매우 어렵습니다. 그러나 이것은 훨씬 더 합리적입니다. 그래서 편집과 제거를 위해 똑같은 일을 할 수 있습니다. 1 가지 더, 어떻게이 모든 데이터를 올바르게 게시 할 수 있도록 mysql 데이터베이스에 추가 할 수 있습니까? 그들이 자신과 20 명의 다른 사람들을 등록한다고 가정 해 봅시다. mysql 데이터베이스에 21 개의 항목을 추가해야합니다. – Richard

을 등록하려면 jQuery ajax를 사용하여 데이터를 데이터베이스에 삽입 할 수있다. – Sutha

이 이제 항상은 아니지만 때때로 이것은 또한 도움이 될 수 있습니다 DataTables 1.10

<input type="button" value="add" id="addbtn" /> 

var dTable = $('#example').DataTable(); 
$('#addbtn').on('click', function() { 
    dTable.row.add([ 
     $('#fname').val(), 
     $('#lname').val(), 
     $('#email').val() 
    ]).draw(); 
});

출처

2014-05-05 15:43:28 Shoe

에서 수행되는 방식은이 버튼을 추가합니다. 이 디버깅을 직접 해본 결과 더 많은 데이터가 있어도 시간이 많이 걸리지 않습니다.

var table = $(".tableclassName")["1"] 
var tableClone = $(".tableclassName")["3"] 
$(yournewrowtext).insertAfter(table.children["1"].children[currentRowId]); 
$(yourfirstcolumn).insertAfter(tableClone.children["1"]. 
children[currentRowId]);

참고 : 고정 된 열을 사용하지 않는 경우에 당신은이 줄을 제거 할 수 있습니다 $ (yourfirstcolumn) .insertAfter (tableClone.children [ "1"]

출처

2017-05-24 10:05:04 Eliotjse

JQuery Datatables 새 행 추가

답변

관련 문제