Get dynamicly grid name

[Ludek Soukup]

I have issue with getting grid name from toolbar component.
I have nested grid with dynamicly fill name, in these grid i have toolbar with combobox. OnChange event in these combo i need to refresh grid where is combo placed. How i can get name of the grid? 

<script id="template" type="text/x-kendo-template">
       @(Html.Kendo().Grid<Rule.TreeViewItem>()
             .Name("grid_#=Text#")
             .Columns(columns =>
             {
                 columns.Bound(o => o.HasChildren).Hidden();
                 columns.Bound(o => o.Text).Filterable(flr => flr.Cell(cell => cell.Operator("contains").ShowOperators(false)));
                 columns.Bound(o => o.ObjectPath).Filterable(flr => flr.Cell(cell => cell.Operator("contains").ShowOperators(false)));
                 columns.Bound(o => o.ChildrenPath).Filterable(flr => flr.Cell(cell => cell.Operator("contains").ShowOperators(false)));
             })
             .ToolBar(t => t
                  .Template("#= kendo.render(kendo.template($('\\#comboTemp').html()), [{ Text, ChildrenPath }]) #")
             )
             .Events(e => e.DataBound("removeExpander"))
             .Resizable(resize => resize.Columns(true))
             .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
             .ClientDetailTemplateId("template")
             .DataSource(dataSource => dataSource
                 .Ajax()
                 .PageSize(100)
                 .Model(m => m.Id(o => o.ObjectPath))
                 .Read(read => read.Action("GetAttributes", "Rule", new {objectPath = "#= ChildrenPath #"}))
             )
             .Pageable(pageable => pageable
                 .Input(true)
                 .Numeric(false)
                 .PageSizes(new int[] {10, 20, 50, 100})
                 .Refresh(true)
             )
             .AutoBind(false)
             .Sortable(sort => sort.SortMode(GridSortMode.MultipleColumn))
             .ToClientTemplate()
         )
</script>

<script type="text/x-kendo-template" id="comboTemp">
    @(Html.Kendo().DropDownList()
                  .Name("targetFor#=Text#")
                  .DataTextField("SchemaName")
                  .DataValueField("SchemaPath")
                  .Events(events => events.Change("onNestedSchemaChange"))
                  .DataSource(ds =>
                      ds.Read("GetTargetSchemas", "Rule", new { objectPath = "#=ChildrenPath#" })
                  )
                  .ToClientTemplate()
    )
</script>

<script type="text/javascript">
    function onNestedSchemaChange(e) {
        // code here
    }
</script>

[Dimiter Topalov]

Hello Ludek,

You can get a reference to the closest Grid's element (the DIV it is initialized from) via the [data-role="grid"] attribute, and the ID of the element, returned by the mentioned query - via the jQuery attr() method:

change: function(e) {
  var closestGridElement = e.sender.element.closest('[data-role="grid"]');
  var id = closestGridElement.attr('id');
  console.log(id);
}

A reference to the actual Kendo UI Grid widget is available via closestGridElement.data('kendoGrid');

http://dojo.telerik.com/iZisE

I hope this helps.

Regards,
Dimiter Topalov
Telerik by Progress

[Chris]

If you already have the grid widget, then you can get the name as follows:

let gridName = grid.element.attr("id");

[Ludek Soukup]

I was need for read nested grid.

function onNestedSchemaChange(e) {
     var grid = this.wrapper.closest("[data-role=grid]").data("kendoGrid");
     grid.dataSource.read();
}

This is better way, but thank you.

[Attila]

Oh buddy! 

 

Thanks for that! That saved my day! :)