update grid datasource form combobox
1 Answer 8 Views
Robert
Top achievements
Rank 1
Iron
Robert asked on 06 May 2021, 02:33 PM

In asp.net core I would like to refresh a grid form combobox.

 

Here my code but not working

 

<div class="k-content">
    @(Html.Kendo().ComboBox()
              .Name("periods")
              .HtmlAttributes(new { style = "width:100%;" })
              .DataTextField("Description")
              .DataValueField("NoPeriod")
              .Placeholder("Choisir une période")
              .Filter(FilterType.Contains)
              .SelectedIndex(0)
              .DataSource(source =>
              {
                  source.Read(read =>
                  {
                      read.Action("PeriodList_Read", "TimeSheet");
                  });
              })
            .Events(e =>
            {
                e.Change("onAssigneeChange");
            })
        )
</div>

<div class="k-content">

    @(Html.Kendo().Grid<ProKontrolTimeSheet.Models.TimeSheetItemVIEW>()
        .Name("TimeSheetGrid")
        .Reorderable(reorder => reorder.Columns(true))
        .Mobile()
        .Columns(columns =>
        {
            //columns.Select().Width(50);
            columns.Bound(p => p.NoTimeSheet).HtmlAttributes(new { id = "NoTimeSheet", style = "display : none" });
            columns.Bound(p => p.Journee).Width(125).HtmlAttributes(new { style = "text-align:center" });
            columns.Bound(p => p.Debut);
            columns.Bound(p => p.Fin).Width(150).HtmlAttributes(new { style = "text-align:center" });
            columns.Bound(p => p.Contract).Width(150).HtmlAttributes(new { style = "text-align:center" });
            columns.Bound(p => p.Project).Width(150).HtmlAttributes(new { style = "text-align:center" });
            columns.Bound(p => p.Category).Width(150).HtmlAttributes(new { style = "text-align:center" });
            columns.Bound(p => p.Emplacement).Width(150).HtmlAttributes(new { style = "text-align:center" });

        })
        .Scrollable(s=> s.Virtual(true))
        .HtmlAttributes(new { style = "height:750px;"})
         .Sortable(sortable => sortable
          .AllowUnsort(true)
          .SortMode(GridSortMode.MultipleColumn)
          .ShowIndexes(true))
        .DataSource(dataSource => dataSource
            .Ajax()
            .GroupPaging(false)
            .PageSize(50)
            .Batch(true)
            .AutoSync(true)
            .ServerOperation(false)
            .Read(read => read.Action("TimeSheetPeriod_Read", "TimeSheet").Data("additionalInfo")
            )
         )
    )
</div>
<script>
    var NoPeriod = 0
    function onAssigneeChange(e) {
        NoPeriod = e.sender.value();
        $("#TimeSheetGrid").dataSource.Data("additionalInfo").read();
    }


    function additionalInfo() {
        return {
            PeriodId: NoPeriod
        }
    }
</script>

1 Answer, 1 is accepted

Sort by
0
Mihaela
Telerik team
answered on 11 May 2021, 11:12 AM

Hi Robert,

Thank you for the provided code snippets.

I have investigated them and would suggest the following:

  1. Get an instance of the grid.
  2. Call the "read" method of the DataSource component. By design, the grid will load the data that is passed to the "Read" Action method (.Read(read => read.Action("TimeSheetPeriod_Read", "TimeSheet").Data("additionalInfo")).

 

<script>
  function onAssigneeChange(e) { 
    NoPeriod = e.sender.value();
    $("#TimeSheetGrid").getKendoGrid().dataSource.read();
  }
</script>

 

Would you please give a try to this approach and let me know if it works as expected at your end?

 

 

Best, Mihaela Lukanova Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Asked by
Robert
Top achievements
Rank 1
Iron
Answers by
Mihaela
Telerik team
Share this question
or