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. Image for the cookie policy date

customToolbarItem with separation between them

Good morning.

I would like to separate the cancel and save button from the others, something like the next image. Can I do it?

I will be waiting for your reply, thank you in advance.

Regards, Luis Carlos.

1 Reply

VN Vignesh Natarajan Syncfusion Team February 27, 2019 05:30 AM UTC

Hi Luis, 
Thanks for contacting Syncfusion Support. 
Query: “I would like to separate the cancel and save button from the other” 
From your query, we understand that you need to separate the cancel and update icon with the border. We have achieved your requirement by applying CSS to the toolbar icons( cancel and save button from other icons). Please refer to the code example:- 
     .e-grid .e-deleteitem{ 
         border-right: 2px solid #282827; 
    <script type="text/javascript"> 
        $(function () { 
                // the datasource "window.gridData" is referred from jsondata.min.js 
              dataSource: window.gridData, 
                allowPaging: true, 
                columns: [ 
                         { field: "OrderID", isPrimaryKey: true, headerText: "Order ID", textAlign: ej.TextAlign.Right}, 
                          .   .     . 
Please get back to us if you need any further assistance. 
Vignesh Natarajan. 

Live Chat Icon For mobile
Up arrow icon