1

MVC ビューでテーブルの行スタイルを条件付きで設定できるようにしたいと考えています。

これが私がテーブルを構築している方法です。モデルの出席エンティティに personID があるかどうかに基づいて td スタイルを設定したいことがわかります。デバッグすると、スタイルが設定されていることがわかりますが、ページが更新されないため、手動で更新するまでスタイルは表示されません。

@foreach (var item in Model.People)
{
    int attendedPersonID = Model.Attendances.Where(a => a.PersonID == item.PersonID).Select(p => p.PersonID).SingleOrDefault();
    <tr>
        <td style="@(attendedPersonID == item.PersonID ? "color:green" : "color:red")"  >
            @Html.HiddenFor(model => item.PersonID)  @Html.DisplayFor(modelItem => item.FullName)
        </td>
        <td>
            <button  value="@item.PersonID" class="present">Present</button>
            <button  value="@item.PersonID" class="absent">Absent</button>
        </td>
    </tr>
}

編集、ページが読み込まれるたびに人のリストをリロードしたくないと決めたので、現在は ajax を使用してテーブルを作成しています。テーブルがajaxで構築されている場合、jQueryセレクターを見つけるにはどうすればよいですか?

 $.getJSON("/Attendance/People/", function(data) {
            var table='<table>';
            $.each( data, function( index, item){
                table+='<tr><td><input type=hidden id="personID" value='+item.personID+' /></td><td>'+item.FullName+'</td><td><button  value='+item.personID+' class="present">Present</button><button  value='+item.personID+' class="absent">Absent</button></td></tr>';       
            });
            table+='</table>';
            $("#table1").html( table );     
        });
4

2 に答える 2

0

私は今、次のような JSON 応答でテーブルを構築しています。

$.getJSON("/Attendance/People/", function(data) {
            var table='<table>';
            $.each( data, function( index, item){
                table+='<tr><td class='+item.personID+'>'+item.FullName+'</td><td><button  value='+item.personID+' class="present">Present</button><button  value='+item.personID+' class="absent">Absent</button></td></tr>';       
            });
            table+='</table>';
            $('#table1').html(table);

ここでtdの初期色を設定しています：

$('td').each(function () { $(this).css('color', 'red') })

出席応答に基づいて、条件付きで td を緑に戻しています。

 $.getJSON("/Attendance/Attendances/", function (data) {
                $.each(data, function (index, item) {
                    $('td.' + item.returnedPersonID).css('color', 'green');
于 2013-09-16T15:11:54.127 に答える