This is a migrated thread and some comments may be shown as answers.

HtmlAttributes on Buttons

3 Answers 560 Views
TreeList
This is a migrated thread and some comments may be shown as answers.
Martin
Top achievements
Rank 1
Martin asked on 27 Apr 2017, 04:10 PM

How do I apply custom HtrmlAttributes to custom tookbar or command buttons in a TreeList (using the MVC wrapper) ?

 

on Kendo Grids, we have used this extensively to set styling and tooltips, e.g. 

.ToolBar(toolbar => { toolbar.Custom().Text("").HtmlAttributes(new { id = "btnClearFilters", @class = "pm-btnFilterClear", title = "Clear all filters" }); })

However, there appears to be no equivalent HtmlAttributes methods on the TreeList toolbar or custom command buttons. 

 

Thanks.

 

3 Answers, 1 is accepted

Sort by
0
Stefan
Telerik team
answered on 01 May 2017, 08:18 AM
Hello Martin,

Indeed, currently, the HtmlAttributes method is not available for the custom buttons in the TreeList toolbar.

I can suggest using the Name method which later can be used to select the element with jQuery and to set additional attributes and classes:

.Toolbar(t => t.Custom().Name("mycommand"))
 
$(function () {
    $("[data-command='mycommand']").attr( "title", "Custom title" );
});


Regards,
Stefan
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data (charts) and form elements.
0
Martin
Top achievements
Rank 1
answered on 02 May 2017, 08:37 AM

Thanks. That's actually exactly what I did.

By the way, the API documentation for the the Name method is wrong:

(http://docs.telerik.com/aspnet-mvc/api/Kendo.Mvc.UI.Fluent/TreeListToolbarBuilder)

It states:

Name(System.String)
The name of the toolbar command. Either a built-in ("create", "excel", "pdf") or custom. The name is reflected in one of the CSS classes, which is applied to the button - k-grid-name. 

The name is actually NOT reflected in a CSS class, and there is no mention here of using the data-command attribute.

Cheers,

Martin

0
Stefan
Telerik team
answered on 03 May 2017, 10:05 AM
Hello Martin,

Thank you for the feedback.

This statement "The name is reflected in one of the CSS classes, which is applied to the button - k-grid-name" is for the build in commands( create is changed to add).

As for the attribute, I will consult that with the relevant team, and add the information if needed.
 
Regards,
Stefan
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data (charts) and form elements.
Tags
TreeList
Asked by
Martin
Top achievements
Rank 1
Answers by
Stefan
Telerik team
Martin
Top achievements
Rank 1
Share this question
or