[Solved] Toolbar custom command's image not show?

[Nick Wu]

Because new record content is so complex , I create new record using single view page.
it seemed that the grid toolbar's default insert command can't be used to redirect other page.
So I use the custom command like below.

ToolBar(commands => commands.Custom().Text("Create New SaleOrder").Action("Create", "SaleOrder").ButtonType(GridButtonType.ImageAndText))

the command works well, but there is no image be showed on the button.
Can I add image to button?

[Victor]

Hi!

We have the exact same issue, have you found any solution on how to add an icon to a custom command button yet?

Thanks
/Victor

[Dimo]

Hello,

If the ButtonType is ImageAndText, the custom command will render a <span> element, however, you will also need to define a (custom) CSS class by using ImageHtmlAttributes. The CSS class will set some background image. For example:

.ToolBar(commands => commands
    .Custom()
        .ButtonType(GridButtonType.ImageAndText)
        .ImageHtmlAttributes(new { @class = "t-icon t-edit"})
        .Text("button text"))

Finally, note that the above functionality did not work well until recently, so you need to use the latest internal build or the Q2 2011 Beta.

Kind regards,
Dimo
the Telerik team