Сравнение дат в шаблоне клиента Kendo HTML Grid

Question

Мне нужно правильно сравнить две даты в клиентском шаблоне 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 не в том же формате.Как я могу сделать эту работу?

Answer 1

Этого можно добиться, отформатировав дату в нужный формат.

https://docs.telerik.com/kendo-ui/framework/globalization/dateformatting Вот как:

kendo.toString(new Date(DueDate), "g") // for -> 11/6/2018 12:00 AM

Answer 2

Это код, который в конечном итоге сработал:

                    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();
}

Answer 3

Есть 2 варианта.

1) Вы можете рассчитать свое состояние на сервере и передать переменную bool клиенту, поэтому ваш шаблон будет выглядеть так:

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

И действие "Счета-фактуры":

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

2) Вам следует преобразовать свойство DateTime в дату JS с помощью метода kendo.parseDate () из doc , чтобы сравнить даты на стороне клиента, поэтому ваш шаблон будет выглядеть так:

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