Set Title for Update and Cancel command buttons

4 posts, 0 answers
  1. Genadij
    Genadij avatar
    7 posts
    Member since:
    Mar 2010

    Posted 10 Apr 2017 Link to this post

    Hi,

    I can set Title HtmlAttribute for Edit and Destroy command button in Grid like:

                                    command.Edit().HtmlAttributes(new { title = "Edit Row" });
                                    command.Destroy().HtmlAttributes(new { title = "Delete Row" });

    But I cannot find the way to set Title for buttons "Update" and "Cancel" which appears during editing.

    Kind regards

    Genadij

     

     

     

     


  2.
  3. Viktor Tachev
    Admin
    Viktor Tachev avatar
    2497 posts

    Posted 12 Apr 2017 Link to this post

    Hello Genadij,

    In order to customize the text for the Update and Canecel buttons you should use the UpdateText and Cancel text methods. Please check out the code snippet below that illustrates the approach:


    command.Edit().UpdateText("custom update text").CancelText("cancel text");


    Regards,
    Viktor Tachev
    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 visualization (charts) and form elements.
  5. Genadij
    Genadij avatar
    7 posts
    Member since:
    Mar 2010

    Posted 12 Apr 2017 in reply to Viktor Tachev Link to this post

    Dear Victor,

    Sorry, but my question was about how to set HtmlAttribute "Title" but not for how to set Text for the command buttons "Update" and "Cancel"

    All command buttons in my project - "edit", "destroy", "update" and "cancel" -  have no text, only icons.

    HtmlAttribute "title" allows to display "tooltip" on button's hover like "Edit Row", "Delete Row". 

    It is possible to set "title" for 2 buttons - Edit and Destroy within widget configuration code, like:

        command.Edit().HtmlAttributes(new { title = "Edit Row" });
        command.Destroy().HtmlAttributes(new { title = "Delete Row" });

    Another 2 buttons - Update and Cancel appear during runtime in Inline Edit Mode and I cannot find the way how to set "Title" for these 2 buttons.

    Thank you.

  7. Viktor Tachev
    Admin
    Viktor Tachev avatar
    2497 posts

    Posted 13 Apr 2017 Link to this post

    Hello Genadij,

    Thank you for clarifying your requirement. 

    In order to set the title attributes for the buttons you can use the following approach. Handle the edit event for the Grid. In the handler you can get reference of the buttons via jQuery and customize their attributes as required.

    .Events(e=>e.Edit("onEdit"))

    function onEdit(e) {
        var updateBtn = $(".k-grid-update");
        var cancelBtn = $(".k-grid-cancel");
     
        updateBtn.attr("title", "custom update title");
        cancelBtn.attr("title", "cancel button title");
         
    }



    Regards,
    Viktor Tachev
    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 visualization (charts) and form elements.
Back to Top