How to post/bind datasource in gird

1 posts, 0 answers
  1. Michel
    Michel avatar
    4 posts
    Member since:
    Jul 2012

    Posted 08 Jul 2012 Link to this post

    Hi,
    I have a model call Route, and in its create page there are multiple inputs to fill in and there are two grids, one is the available locations and the other is the selected locations, and user can move rows from one to another.

    Now, I need to have the list of selected locations when handling create action in the controller. My question is, when a user clicks Save button, is there a way to bind the list of selected locations to a property in Route model (SelectedLocations which is
    list of locations), or is it possible to post the datasource of the selected locations grid along with the rest of input fields?

    I know the other way around, which is using jquery to create a string containing the selected locations ids and bind that string to some property in Route model, but I was wondering if KendoUI could post back the whole list.

    Here is the empty selected location grid: 

    @( Html.Kendo().Grid<Location>()
          .Name("selectedLocations")
          .BindTo((IEnumerable<Location>)ViewBag.Route.SelectedLocations)
          .Columns(columns =>
           {
                  columns.Bound(p => p.Id).Title("ID");
                  columns.Bound(p => p.StopLocation).Title("Stop Location");
           })
           .Selectable(s => s.Mode(GridSelectionMode.Single))
           .DataSource(dataSource => dataSource.Server().Model(model => model.Id(p => p.Id)))
           )

    And here is how I move items from the available to the selected location grid:

    $("#addStopBtn").click(function () {
            var sourceGrid = $('#availableLocations').data('kendoGrid');
            var destinationGrid = $('#selectedLocations').data('kendoGrid');
            sourceGrid.select().each(function (e) {
                var dataItem = sourceGrid.dataItem($(this));
                destinationGrid.dataSource.add(dataItem);
                sourceGrid.dataSource.remove(dataItem);
            });
     
            sourceGrid.refresh();
            destinationGrid.refresh();
        });

    Thanks in advance.

Back to Top