1

我需要能够正确比较 Kendo HTML Grid 的客户端模板中的两个日期。这是我所拥有的：

                @(Html.Kendo().Grid<TfInvoicesReturnModel>()
                    .Name("invoiceGrid")
                    .DataSource(dataSource => dataSource
                                    .Ajax()
                                    .Sort(sort => sort.Add("OrderDate").Descending())
                                    .Read(read => read.Action("Invoices_Read", "Jobs", new { JobNo = Model.JobNo, CustomerNo = Model.CustomerId }))
                                    .Events(events => events.Error("error_handler"))
                                    .Model(model =>
                                    {
                                        model.Id(p => p.InvoiceNo);
                                    })
                                )

                .Columns(columns =>
                {

                    columns.Bound(p => p.InvoiceNo).ClientTemplate(
                         "#if(BalanceDue > 0 && DueDate < " + @CurDate + ") {# " +
                                "<span style='color:red; font-weight:bold'>#: InvoiceNo #</span>" +
                            "#} else {#" +
                                "#: InvoiceNo #" +
                            "#} #"
                        ).Title("Invoice").Width(125);  ...

其中@CurDate 是视图中的一个变量：

String CurDate = DateTime.Now.ToShortDateString();

当我运行它时，CurDate 是正确的。但是当然比较不能正常工作，因为 DueDate 的格式不同。我怎样才能使这项工作？

4

3 回答 3

2

您可以通过将日期格式化为所需的格式来实现这一点。

https://docs.telerik.com/kendo-ui/framework/globalization/dateformatting 这里是如何：

kendo.toString(new Date(DueDate), "g") // for -> 11/6/2018 12:00 AM
于 2018-05-11T08:28:05.730 回答
1

有 2 个选项。

1）您可以在服务器上计算您的条件并将 bool 变量传递给客户端，因此您的模板将如下所示：

"#if(DateCheck) {# " +
    "<span style='color:red; font-weight:bold'>#: InvoiceNo #</span>" +
"#} else {#" +
    "#: InvoiceNo #" +
"#} #"

和行动“Invoices_Read”：

...
.Select(w => new TfInvoicesReturnModel
{
    ...
    DateCheck = w.BalanceDue > 0 && w.DueDate < DateTime.Now.Date
    ...
})
...

2）您应该使用文档中的 kendo.parseDate() 方法将 DateTime 属性转换为 JS 日期，以便在客户端比较日期，因此您的模板将如下所示：

"#if(BalanceDue > 0 && DueDate < kendo.parseDate(" + @CurDate + ", YOUR_FORMAT)) {# " +
    "<span style='color:red; font-weight:bold'>#: InvoiceNo #</span>" +
"#} else {#" +
    "#: InvoiceNo #" +
"#} #"
于 2018-05-11T08:27:59.803 回答
0

这是最终起作用的代码：

                    columns.Bound(p => p.DueDate).ClientTemplate(
                         "#if(BalanceDue > 0 && new Date(DueDate) < getTodaysDate()) {# " +
                                "<span style='color:red; font-weight:bold'>#: kendo.toString(new Date(DueDate), 'MM/dd/yyyy') #</span>" +
                            "#} else {#" +
                                "#: kendo.toString(new Date(DueDate), 'MM/dd/yyyy') #" +
                            "#} #"
                        ).Title("Due Date");

这是在脚本部分获取今天日期的函数：

function getTodaysDate()
{
    return new Date();
}
于 2018-05-18T17:51:44.170 回答