Cannot pass Data to Read datasource Method

[Dario]

I would pass DatePicker value to datasource of grid, using Data method in this way

<div class="d-inline">
        <label>Data</label>
        @(Html.Kendo().DatePicker()
                .Name("dateFilterDatepicker") // The name of the DatePicker is mandatory. It specifies the "id" attribute of the widget.
                .Min(new DateTime(1900, 1, 1)) // Sets the min date of the DatePicker.
                .Max(new DateTime(2099, 12, 31)) // Sets the max date of the DatePicker.
                .Value(DateTime.Today) // Sets the value of the DatePicker.
                  )
        @(Html.Kendo().Button()
                    .Name("textSearchButton")
                    .HtmlAttributes( new {type = "submit"} )
                    .Content("Ricerca")
                    .Events(e=>e.Click("onClick")))
    </div>

    <div class="text-center form-group">
        @(Html.Kendo().Grid<ItemModel>()
              .Name("itemGrid")
              .ToolBar(t => t.Search())
              .Filterable()
              .AutoBind(true)
              .Columns(columns =>
              {
                  columns.Bound(f => f.No);
                  columns.Bound(f => f.Description);
                  columns.Bound(f => f.Brand);
                  columns.Bound(f => f.NetChange);
                  columns.Bound(f => f.PurchasesQty);
                  columns.Bound(f => f.LastEntryDate).Format("{0:dd/MM/yyyy}"); ;

              })
              .Pageable() // Enable paging
              .Sortable() // Enable sorting
              .Scrollable(scrollable => scrollable.Virtual(true))
              .HtmlAttributes(new { style = "height:430px;" })
              .DataSource(dataSource => dataSource //Configure the Grid data source.
                  .Ajax() //Specify that Ajax binding is used.
                  .PageSize(20)
                  .Read(read => read.Action("Item_ReadData", "Home").Data("additionalData")) // Set the action method which will return the data in JSON format.
               )
        )
    </div>
    <script>
        function additionalData() {
            var value = $("#dateFilterDatepicker").data("kendoDatePicker").value();
            return { selectedDate: value }; // send the filter value as part of the Read request
        }

        function onClick() {
            var grid = $("#itemGrid").data("kendoGrid");
            grid.dataSource.read(); // rebind the Grid's DataSource
        }
    </script>

But I'm sure that date is valued, but it seems that not fires additionalData function when it request read method of datasource

My action

[Authorize]
        public IActionResult Item_ReadData([DataSourceRequest] DataSourceRequest request, DateTime selectedDate)
        {
            var itemsFound = new List<ItemModel>();

            System.Security.Claims.ClaimsPrincipal currentUser = this.User;
            var scope = currentUser.Claims.ToList().SingleOrDefault(c => c.Type == "Scope")?.Value;

            using (DbNavision ctx = new DbNavision())
            {
                if (selectedDate != new DateTime(1, 1, 1))
                    itemsFound = (from rec in ctx.UpSrlItem
                                  select new ItemModel(rec, selectedDate, scope)).ToList();
                var dataResult = itemsFound.ToDataSourceResult(request);
                return Json(dataResult);
            }
        }

 

The second parameter of action is ever empty, but if I remove it from action definition, is the same.

what's wrong?

[Georgi]

Hi Dario,

I have examined your configuration and I did not notice anything that might cause an issue. The additionalData handler should be executed if there are no js errors. You could add a console log within the handler to confirm if the dataSource calls it. I would also ask you to check if the there are any errors in the console of your browser.

Furthermore, could you please check the payload of the request and make sure that the parameter is included? If it is, please make sure that the date is formatted correctly as the server might be unable to parse the value to a date.

You could test with a different format as follows:

        function additionalData() {
            var value = $("#dateFilterDatepicker").data("kendoDatePicker").value();
            return { selectedDate: kendo.toString( value, "MM/dd/yyyy") }; // send the filter value as part of the Read request
        }

Regards,
Georgi
Progress Telerik