Grid show / hide rows

[David Price]

Hello,

How can I using a checkbox and javascript show and hide the 3rd row in a grid?

[Farveen Sulthana Thameeztheen Basha]

  

Hi David, 

Thanks for contacting Syncfusion Support. 

Query #:- How can I using a checkbox and javascript show and hide the 3rd row in a grid? 

We have checked your query and we need some additional information to achieve your requirement. Please share us the following details:- 

1. Do you want the checkbox to be placed as one of the column in Grid and while check or uncheck the checkbox, you need to show/Hide the row? 

2.Or else, do you want to check box placed Externally and perform show/ Hide the row in Grid. 

3. Screenshot/Video Demo to achieve your requirement. 

Regards, 

Farveen sulthana T 

[David Price]

Hi,

I want the checkbox placed Externally and perform show/ Hide the row in Grid. 

[Farveen Sulthana Thameeztheen Basha]

Hi David, 

Query # :- I want the checkbox placed Externally and perform show/ Hide 3rd  row in Grid.  

As per your requirement we have placed the checkbox column externally and while on checking we have get the 3^rd row by using getRowByIndex method and hide the row also show the row while on uncheck. 

Please refer to the code example:- 

<script> 

            $("input:checkbox.country").click(function () { 

                var gridObj = $("#Grid").ejGrid("instance"); 

                if ($(this).is(":checked")) 

                    gridObj.getRowByIndex(3).hide(); 

                else 

                    gridObj.getRowByIndex(3).show(); 

            }); 

 

</script> 

    

        <script type="text/javascript"> 

            $(function () { 

                $("#Grid").ejGrid({ 

                    dataSource: window.gridData, 

                    allowPaging: true, 

                    enableHeaderHover: false, 

                       .   .   . 

               }); 

 

            }); 

 

 

        </script> 

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

API Link:-  https://help.syncfusion.com/api/js/ejgrid#methods:getrowbyindex 

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

Regards, 

Farveen sulthana T