ejs-checkbox in datagrid toolbar

[Stefano Capobianco]

Hi all, I would like to use, in my datagrid toolbar an ejs-checkbox to filter data.

I've tried to add a template item to toolbox using :

toolbarItems.Add(new {template = "<ejs-checkbox id='check' label='test' checked='' change='OnChange'></ejs-checkbox>", align = "right" })

without result.

I've solved with :

toolbarItems.Add(new {template = "<input type='checkbox' id='check1' onclick='handleClick(this);'> Show All</input>", align = "right" });

How can i have the same result with ejs-checkbox ?

Thanks in advance

Stefano

 

[Thiyagu Subramani]

Hi Stefano, 

  

Thanks for contacting Syncfusion support. 

  

Based on your shared information we suspect that you want render our EJ2 checkbox in toolbar items. To achieve this requirement we suggest you to use below code blocks in your application. We have checkbox control using JavaScript way in created event. 

  

@{ 

    List<object> toolbarItems = new List<object>(); 

    toolbarItems.Add(new { template = "#menuitem", align = "right" }); 

} 

  

    <div id="menuitem"> 

        <input type="checkbox" class='check'/> 

    </div> 

  

<ejs-grid id="Grid"  created="created" toolbar="toolbarItems" allowFiltering="true" dataSource="@ViewBag.DataSource"> 

    <e-grid-columns> 

        . . . . . . .  . 

</ejs-grid> 

  

<script> 

    function created() { 

        var checkBoxObj = new ej.buttons.CheckBox({ checked: true, label: 'Show All' }); 

        checkBoxObj.appendTo(".check");  

    } 

</script> 

  

 

  

UG:  https://ej2.syncfusion.com/documentation/check-box/getting-started/ 

  

Demo Sample : https://ej2.syncfusion.com/demos/#/material/button/checkbox.html 

  

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

  

Regards, 

Thiyagu S 

[Stefano Capobianco]

Hi Thiyagu, your solution works very well. I suggest adding style="display: none;" to the div menuitem so the same is hidden when the page is created and the grid is created and populated.

Thanks

Stefano

 

[Thiyagu Subramani]

Hi Stefano, 

Thanks for the update. 

We are happy to hear that the provided solution works at your end.  

Please get back to us if you need further assistance. 

Regards, 

Thiyagu S