Updating a control in a Grid Toolbar

[Pier-Gilles]

Hi,

I'm trying to update a label inside a grid toolbar  with the Count on selectedItem of the grid.

I'm able to retrieve the number of selected item with the "onChange" event ( in an JS alert in my test)

using:

<script type="text/javascript">
    function onChange(arg) {
        var selected = $.map(this.select(), function (item) {
            return $(item).text();
        });
        alert(selected.length);
         }
</script>

but i'm having trouble accessing the label inside the toolbar of the grid (to modify the text property).

I'm not quite sure of the syntax to retrieve the label..  

I tried several way to access it and I'm having not luck so far.

 

Is there a way to access a control inside the toolbar of a grid from JavaScript?

 

Note:  I'm using "Telerik.UI.for.AspNet.Core": "2016.3.914"

 

[Konstantin Dikov]

Hi,

You can set an ID for the element that you are using in the toolbar and get reference to it with jQuery. For your convenience, following is an example with such approach:

<script>
    function onChange(e) {
        $("#selectCount").html(e.sender.select().length);
    }
</script>
@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.EmployeeViewModel>()
        .Name("grid")
        .ToolBar(t=>t.Template("Selected items: <span id='selectCount'>0</span>"))

Best Regards,
Konstantin Dikov
Telerik by Progress