7

姓名、電話番号、電子メール、民族性を入力できるページがあり、[追加] をクリックすると、データテーブルにエントリが追加されます。問題は、テーブルの追加をクリックした後、次のように表示されることです。

テーブル

各行の高さを調整して、適切に表示するにはどうすればよいですか。これはテーブルの私のhtmlコードです:

<div id="table">
    <form id="add_nrow" title="Add">
        <br/>
        <label for="name">First Name</label><input type="text" name="fname" id="fname" class="required" rel="0" />
        <br />
        <label for="name">Last Name</label><input type="text" name="lname" id="lname" rel="1" />
        <br />
        <label for="name">Phone</label><input type="text" name="phone" id="phone" rel="3" />
        <br />
        <label for="name">Email</label><input type="text" name="email" id="email" rel="4" />
        <br />
        <label for="name">Ethnicity</label><input type="text" name="ethnicity" id="ethnicity" rel="5" />
        <br />   
        <input type="button" value="Add" id="addbtn" /><br/><br/>  
    </form>

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

ここに私のjqueryコードがあります

$("#addbtn").click(addrow);
$('#reg_more').dataTable({
                "bLengthChange": false,
                "bInfo": false,
                "bPaginate": false,
                "bStateSave": true,
                "rowHeight": 'auto',
                "bFilter": true,
                "bSort": false,
                "bAutoWidth": false
            });


function addrow() {
    $('#reg_more').dataTable().fnAddData( [
        $('#fname').val(),
        $('#lname').val(),
        $('#phone').val(),
        $('#email').val(),
        $('#ethnicity').val()] );
    }

私は本当に2つの質問があります:

  1. ユーザーがデータを見ることができるように高さを適切に調整するにはどうすればよいですか?
  2. 20 人の情報を入力した場合、mysql データベースに入力できるように、そのすべてのデータを取得するにはどうすればよいですか?
4

2 に答える 2

6

このフィドルでわかるように、コードは正しく、期待どおりに動作するはずです。

いずれにせよ、行の高さを設定するには、単に css を使用します

 tr { height: 50px }

これ以上複雑にする必要はないと思います。

データをデータベースに挿入する方法に関する質問については、Googleにたくさんの例があります。

于 2012-09-16T13:14:20.553 に答える