按日期范围按日期范围上的Kendo MVC网格上的服务器端过滤

Question

我在kendo Grid创建的DateTime中有一个列。我想根据STARTDATE和ENDDATE的CreateDate通过服务器端过滤滤网的数据。

我已经为他尝试了各种方法，但不幸的是什么都没有用。我还有另一个搜索场景，我可以根据dropdownlist的数据过滤数据。

这是我的代码，用于按值的值进行过滤

if (request.Filters.Any())
{
    foreach (FilterDescriptor filterDescriptor in request.Filters)
    {
        if (filterDescriptor.Operator == FilterOperator.IsEqualTo)
        {
            obj = obj.Where(m => m.Type == filterDescriptor.Value.ToString());
        }
    }
}  

这是我在日期范围的部分视图中的代码

<span><h3>Date Range:</h3></span>
<br />
<div class="col3 fLeft">
    <span>From:</span>
        @(Html.Kendo().DatePicker()
            .Name("dpDateFrom")
            .Value(DateTime.Today.AddDays(-1))
            .Format("dd/MM/yyyy")
            .Enable(true)
        )
</div>
<div class="col7 fRight">
    <span>To:</span>
    @(Html.Kendo().DatePicker()
        .Name("dpDateTo")
        .Value(DateTime.Today)
        .Format("dd/MM/yyyy")
        .Enable(true)
    )
</div>
<div>
    <button class="normal-btn" id="btnFilter" onclick="FilterGridByDate();">Search</button><br />
</div>

我在单击搜索按钮上应用了此JavaScript代码

function FilterGridByDate() {
    $From = $("#dpDateFrom").val();
    $To = $("#dpDateTo").val();
    $filtergridbydate = new Array();
    if ($From) {
        $filtergridbydate.push({ field: "CreatedDate", operator: "gte", value: $From });
    }
    if ($To) {
        $filtergridbydate.push({ field: "CreatedDate", operator: "lte", value: $To });
    }
    var Grid = $("#grid").data("kendoGrid");
    Grid.dataSource.filter($filtergridbydate);
}

我应该如何在控制器中处理它？

Answer 1

尝试：

您的视图：

@(Html.Kendo().Grid<Namespace.Model>()
            .Name("grid")
            .DataSource(dataSource =>
            {
                dataSource.Ajax().PageSize(20)
                .Read(read => read.Action("ActionName", "ControllerName").Data("dateFilters"));
            })

请参阅数据（" dateFilters"）？现在您的JavaScript：

function dateFilters() {
    return {
         dpDateFrom: $("#dpDateFrom").val(),
         dpDateTo: $("#dpDateTo").val(),
    }
}
function FilterGridByDate() {
    $("#grid").data("kendoGrid").dataSource.read();
}

和您的控制器中的动作

public ActionResult ActionName([DataSourceRequest]DataSourceRequest request, DateTime dpDateFrom, DateTime dpDateTo) 
{
    //use the two datetimes here
    return query.Where(x => x.StartDate >= dpDateFrom && x.EndDate <= dpDateTo).ToDataSourceResult(request);
}

Answer 2

最简单的方法可能是这样的。

网格

使用默认数据源配置网格，加载一些默认值。例如，上周的。

@(Html.Kendo().Grid<MyModel>()
    .Name("grid")
    .DataSource(ds => ds
        .Ajax()
        .Read("MyAction", "Home", new { startDate = DateTime.Now.AddDays(-7), endDate = DateTime.Now }))
)

控制器

控制器只需要能够处理日期，然后使用两个日期查询数据库。

public JsonResult MyAction([DataSourceRequest]DataSourceRequest request, DateTime startDate, DateTime endDate) {
    var result = BL.ExecuteSomeQuery(startDate, endDate);
    return Json(result.ToDataSourceResult(request));
}

javascript

单击按钮时，此功能被调用。它需要使用read();更新数据源参数，这将调用您的控制器并更新网格。

function FilterGridByDate(){
    var from = $("#dpDateFrom").val();
    var to = $("#dpDateTo").val();
    var grid = $("#grid").data("kendoGrid");
    grid.dataSource.read({ startDate: from, endDate: to });
}