customToolbarItem with separation between them

[Luis Carlos]

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.

[Vignesh Natarajan]

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:- 

 

<style> 

     .e-grid .e-deleteitem{ 

         border-right: 2px solid #282827; 

    } 

   </style> 

    <script type="text/javascript"> 

        $(function () { 

            $("#Grid").ejGrid({ 

                // 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}, 

                          .   .     . 

                ] 

            }); 

        }); 

    </script> 

 

Sample Link:- https://jsplayground.syncfusion.com/i2mas0yc 

 

Please get back to us if you need any further assistance. 

 

Regards, 

Vignesh Natarajan.