We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

customToolbarItems tooltips

Thread ID:

Created:

Updated:

Platform:

Replies:

127471 Nov 17,2016 01:23 PM UTC Nov 21,2016 05:13 AM UTC JavaScript 3
loading
Tags: ejGrid
Anton E
Asked On November 17, 2016 01:23 PM UTC

Hello. I'm trying to add custom items in the grid's toolbar. I want them to look like native ones as I want to use them both simultaneously.

So i add:
toolbarSettings: {
            showToolbar: true, toolbarItems: ["search", "delete"],
            customToolbarItems: [{
                templateID: "#editTemplate"
            },
            {
                templateID: "#addTemplate"
            }]
        }

<script id="editTemplate" type="text/x-jsrender">
    <a class="e-toolbaricons e-icon editTemplate" />
</script>
<script id="addTemplate" type="text/x-jsrender">
    <a class="e-toolbaricons e-icon addTemplate" />
</script>

<style type="text/css" class="cssStyles">
    .editTemplate:before {
        content: "\e653";
    }
    .addTemplate:before {
        content: "\e676";
    }
</style>


Now i'm getting this: http://static.terribles.ru/files/2016-11-17--16-20-29-scr2.png

The point is that tooltip is exactly copies CSS-class which is used to draw the toolbar item. I need this tooltip to be cyrillic ("Редактировать"), and you cannot use cyrillic CSS-classes. Is there any workaround for this situation?





Venkatesh Ayothi Raman [Syncfusion]
Replied On November 18, 2016 07:26 AM UTC

Hi Anton, 
Thanks for contacting Syncfusion support. 

We have achieved your requirement using actionComplete event in Grid. In this event, we can find the customtoolbar items and change the tooltip content for corresponding the customtoolbar item. Please refer to the code example and sample, 
Code example
//Grid 
$("#Grid").ejGrid({ 
                    // the datasource "window.gridData" is referred from jsondata.min.js 
                    dataSource: window.gridData, 
                    allowPaging: true, 
                    editSettings: { allowEditing: true, allowAdding: true, allowDeleting: true }, 
                    actionComplete:"actionComplete", 
                    toolbarSettings: { 
                        showToolbar: true, toolbarItems: ["search", "delete"], 
                        customToolbarItems: [{ 
                            templateID: "#editTemplate" 
                        }, 
                        { 
                            templateID: "#addTemplate" 
                        }] 
                    }, 
                    columns: [ 
                            . . . 
                    ] 
                }); 
                
 
            }); 
 
//Action complete event 
 
function actionComplete(args) { 
 
                var customToolbar; 
                for (var i = 0; i < this.model.toolbarSettings.customToolbarItems.length; i++) { 
                    customToolbar = this.model.toolbarSettings.customToolbarItems[i]; 
                    var customToolbarValue = customToolbar["templateID"].slice(1); // get the customtoolbar value  
                    if (customToolbarValue == "editTemplate") 
                    $("#" + this._id + "_" + customToolbarValue).attr({ 
                        "data-content": "Edit" //here you can set the cyrillic value 
                    }); 
                    else if(customToolbarValue == "addTemplate") 
                        $("#" + this._id + "_" + customToolbarValue).attr({ 
                            "data-content": "Add" //here you can set the cyrillic value 
                        }); 
                } 
            } 
            
             

 

Regards, 
Venkatesh Ayothiraman. 


Anton E
Replied On November 18, 2016 12:15 PM UTC

Thank you!

Venkatesh Ayothi Raman [Syncfusion]
Replied On November 21, 2016 05:13 AM UTC

Hi Anton, 

Thanks for the update. 

We are happy to hear that your requirement is achieved. 

Regards, 
Venkatesh Ayothiraman. 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

or the page will be automatically redirected to sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;