6. ตาราง

Table

    ทำให้หน้าเว็บแสดงผลข้อมูลในรูปแบบตารางเพื่อความเป็นระเบียบ



    แก้ไขส่วนแสดงข้อมูลที่ index.html

{% if account_list %}
        <table>
        <tr>
            <th> Name </th>
            <th> Create </th>
        </tr>
        {% for account in account_list %}
        <tr>
            <td>
            <a href = {% url 'accounts:detail' account.id %}>{{account.name}}</a>
            </td>
            <td> {{account.create|date:"d/m/Y"}} </td>
        </tr>
        {% endfor %}
        </table>
    <br>
{% endif %}

    โดยที่
    <table> จะเป็น tag คลุมส่วนที่จะให้เป็นตาราง
    <tr> จะคลุมแต่ละแถวของตาราง
    <th> ระบุสิ่งที่จะให้อยู่ในแต่ละคอลัมน์เริ่มจากคอลัมน์แรกโดยจะเป็นตัวหนาสำหรับส่วนหัว
    <td> เช่นเดียวกับ <th> แต่จะไม่เป็นตัวหน้าสำหรับส่วนเนื้อหา

    เช่นเดียวกันแก้ไขที่ detail.html

{% if transaction_list %}
    <table>
        <tr>
            <th> Date           </th>
            <th> Description    </th>
            <th> Type           </th>
            <th> Money          </th>
        </tr>
        {% for action in transaction_list %}
        <tr>
            <td>{{action.date|date:"d/m/Y"}}</td>
            <td>{{ action.description }}</td>
            <td>{{action.actionType}}</td>
            <td>{{action.value}}</td>
        <td>
        {% endfor %}
    </table>
    <br>
 {% endif %}

หลังจากนั้นหน้าเว็บจะแสดงผลในรูปแบบตาราง