如何根据条件更改jtable中列的特定行颜色？

Question

 paymentStatus: {
                title: 'Payment Status',
                width: '8%',
                options: {'Paid': 'Paid', 'Due': 'Due'},
                create: false,
                edit: false,
                list: true
            },

更具体一点，我希望payStatus的颜色为红色，因为它是＆＃39;当它被支付时，它就是绿色的。

Answer 1

我对jtable了解不多，但你可以在Jquery这样做

$(function(){
    $('#studentlist tr td').each(function(){
        var i = $(this).index();
        // since i'm interested in the 3rd column, I check for i === 2
        // if you were interested in the 9th column, it would be i === 8
        if (i === 2) {
            $(this).addClass( $(this).text().toLowerCase() );
        }
    });
});

table td {
    border: 1px solid silver;
}

.due {
    background-color: red;
}

.paid {
    background-color: green;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table caption="student list" id="studentlist">
    <thead>
        <tr>
            <th>Name</th>
            <th>Room</th>
            <th>Payment</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Sean</td>
            <td>101</td>
            <td>Due</td>
        </tr>
         <tr>
            <td>Kyle</td>
            <td>230</td>
            <td>Due</td>
        </tr>
         <tr>
            <td>Mohammed</td>
            <td>169</td>
            <td>Paid</td>
        </tr>       
    </tbody>
</table>

Answer 2

使用jtable中的rowInserted事件。

rowInserted: function (event, data) {
                if (data.record) {

                    if (data.record.paymentStatus == 'Paid') {
                        $(data.row).css("background-color", "#DFF0D8");
                    } else if (data.record.paymentStatus == 'Due') {
                        $(data.row).css("background-color", "#F2DEDE");
                    }

                }
            }