构造表时使用if语句

时间:2019-02-13 18:32:00

标签: jquery html

我正在基于ajax调用的结果生成动态表。我必须根据if语句的结果更改一个单元格的背景颜色。 有谁知道该怎么做。

我的用于生成表格的代码

var today = "<?php echo $Today;?>";
var enddate = todate + " " + totime;

console.log("End date", enddate);


var tr_str = "<tr class='TableText'>" +
    "<td style='color:#333;font-size:0.8em;'>" + promotionname + "</td>" +
    "<td  style='color:#333;font-size:0.8em;'>" + deviceid + " " + screenlocation + "</td>" +
    "<td align='center'  style='color:#333;font-size:0.8em;'>" + orientation + "</td>" +
    "<td  style='color:#333;font-size:0.8em;'>" + promotionimage + "</td>" +
    "<td  align='center'  style='color:#333;font-size:0.8em;'>" + mediatype + "</td>" +
    "<td  style='color:#333;font-size:0.8em;'>" + fromdate + "</td>" +
    "<td  style='color:#333;font-size:0.8em;'>" + todate + "</td>" +

// HOW CAN I PLACE AN IF STATEMENT HERE
if (enddate < today) {
    "<td align='center' style='color:#333;font-size:0.8em;' class='Complete'>Complete</td>" +
} else {
    "<td align='center' style='color:#333;font-size:0.8em;' class='Scheduled'>Scheduled</td>" +
}

"<td align='center'  style='color:#333;font-size:0.8em;'><input type='button' name='edit' value='Edit' id=" + (i + 1) + " class='btn btn-info btn-xs btn-block edit_data'></td>" +
    "</tr>";
$("#userTable tbody").append(tr_str);

在此先感谢您的时间和帮助。

2 个答案:

答案 0 :(得分:3)

如果您的问题正确无误。您要将基于条件附加到行字符串变量,可以通过以下方式实现。 您应该通过删除末尾的+并以;结尾的结尾来完成将初始html分配给tr_str变量的语句。

然后按如下所示更改条件块中的代码

// HOW CAN I PLACE AN IF STATEMENT HERE
if(enddate < today ) {
    tr_str = tr_str + "<td align='center' style='color:#333;font-size:0.8em;' class='Complete'>Complete</td>";
} else {
    tr_str = tr_str +"<td align='center' style='color:#333;font-size:0.8em;' class='Scheduled'>Scheduled</td>" +
}

答案 1 :(得分:2)

我不知道您的日期时间变量的格式,因此无法确认if(enddate < today)代码来检查一个日期是否早于另一个日期,但是您可以处理该日期。要回答您的特定问题:

您正在创建一个包含HTML代码的变量。在IF语句的位置:(a)停止创建tr_str变量(即以分号结尾),(b)执行IF语句(将适当的字符串附加到tr_str变量),然后(c)继续追加到变量:

var today = "<?php echo $Today;?>";
var enddate = todate + " " + totime;

console.log("End date", enddate);


var tr_str = "<tr class='TableText'>" +
"<td style='color:#333;font-size:0.8em;'>" + promotionname + "</td>" +
"<td  style='color:#333;font-size:0.8em;'>" + deviceid + " " + screenlocation + "</td>" +
"<td align='center'  style='color:#333;font-size:0.8em;'>" + orientation + "</td>" +
"<td  style='color:#333;font-size:0.8em;'>" + promotionimage + "</td>" +
"<td  align='center'  style='color:#333;font-size:0.8em;'>" + mediatype + "</td>" +
"<td  style='color:#333;font-size:0.8em;'>" + fromdate + "</td>" +
"<td  style='color:#333;font-size:0.8em;'>" + todate + "</td>";

// HOW CAN I PLACE AN IF STATEMENT HERE
if(enddate < today ) {
    tr_str += "<td align='center' style='color:#333;font-size:0.8em;' class='Complete'>Complete</td>" +
} else {
    tr_str = += "<td align='center' style='color:#333;font-size:0.8em;' class='Scheduled'>Scheduled</td>" +
}

tr_str += "<td align='center'  style='color:#333;font-size:0.8em;'><input type='button' name='edit' value='Edit' id=" + (i+1) + " class='btn btn-info btn-xs btn-block edit_data'></td>" +
"</tr>";
$("#userTable tbody").append(tr_str);