javascript - 更改 jquery ajax 表中一行的字体颜色

Question

我想根据函数内部应用的条件更改一行中值的字体颜色。如果 TotalStudent 大于房间容量，则将学生信息添加到表格中，字体颜色为红色。以下是我尝试过的。我使用了 ajax 方法，在成功函数中我正在生成表来插入值。状况良好。

Create.cshtml

$.ajax({
  type: "POST",
  url: '@Url.Action("AddStudent", "Student")',
  data: model,
  dataType: "json",
  success: function(data) {
    $('#dialog').dialog('close');
    alert(data.countstudent);
    alert(data.roomcapacity);
    //var student = data.countstudent;
    if (data.countstudent > data.roomcapacity) {
      var tblEndrolled = $("#tblEnrolled");
      $.each(data.record, function(index, item) {
        $('.status').css("color", "red");
        var tr = $("<tr></tr>");
        tr.html(("<td>" + '<input type="submit" id="' + item.Id + '" value="Remove" class="" />' + "</td>") +
                " " + ("<td class = 'status'>" + item.FirstName + "</td>") +
                " " + ("<td>" + item.LastName + "</td>") +
                " " + ("<td>" + item.EmailAddress + "</td>") +
                " " + ("<td>" + item.Phone + "</td>"));
        tblEndrolled.append(tr);
      });
    }

    <div>
      <strong style = "font-size:20px" > Enrolled Students: < /strong> 
        <table class = "table table-bordered table-responsive table-hover" id="tblEnrolled">
        <tr>
        <th>Action</th>
                @*<th>User Id</th>
                *@<th>First Name</th>
                <th>Last Name</th>
                <th>Email</th>
                <th>Phone</th>
        </tr>
        </table> 
        </div>

Answer 1

它需要两个修改:

1. 第一，在创建 tr 时添加类状态。
2. 第二次在每个循环结束时应用 css 样式，如下所示:

.

//var student = data.countstudent;
if (data.countstudent > data.roomcapacity) {
    var tblEndrolled = $("#tblEnrolled");
    $.each(data.record, function(index, item) {
    var tr = $("<tr class = 'status'></tr>");
        tr.html(("<td>" + '<input type="submit" id="' + item.Id + '" value="Remove" class="" />' + "</td>") +
                " " + ("<td >" + item.FirstName + "</td>") +
                " " + ("<td>" + item.LastName + "</td>") +
                " " + ("<td>" + item.EmailAddress + "</td>") +
                " " + ("<td>" + item.Phone + "</td>"));
        tblEndrolled.append(tr);
    });
    $('.status').css("color", "red");
}

希望它能满足您的要求。