6

必要に応じて最大 20 人を登録できる登録ページを作成しています。だから私はこれらのテキストボックスを持っています:

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/>

これは、DataTables の JQuery 初期化を含む私の html テーブルです。

<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
});

ここで、追加ボタンを配置して、ユーザーが姓と名を入力し、電子メールを送信して追加を押すと、それがテーブルに追加されるようにしたいと考えています。どうすればこれを行うことができますか？

4

3 に答える 3

23 
$(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-16T03:56:30.263 に答える
5

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-05T15:43:28.760 に答える