Grid events

[Petra Visic]

Hello,

I use ejGrid control and I want a certain element outside of grid to be shown only when record in a grid is selected and that record has a certain value of certain property. 

In the beginning, the element is hidden. Then I use rowSelected event and check the value of that property for selected record and then show the element if that record's property has desired value, and hide it otherwise. But that does not give me a complete solution, because if I select a record whit desired value of property and then go to the next page, or click on some button outside of grid, the element is still shown. 

I tried to hide the element on rowDeselected event, which works in case when I click something outside of grid, but does not work when I go to the next page (element is still shown although no record is selected). 

Then I added the hiding of element on actionBegin event too, and now it works as expected for all the cases I tested, but I do not know if that is the right way to do that nor if some other cases exist when this solution does not work.

My code now looks something like this:

        $("#Grid").ejGrid({

            rowSelected: function () {

                if ($("#Grid").ejGrid("instance").getSelectedRecords()[0].MyProperty == [DesiredValueOfMyProperty]) {

                    // show element

                }

                else {

                    // hide element

                }

            },

            actionBegin: function () {

                    // hide element

            },

            rowDeselected: function () {

                    // hide element

            }

        })

Could you please help me with this? I would like to know which events to use to get correct and complete solution.

[Padmavathy Kamalanathan]

Hi Petra, 

Thanks for contacting Syncfusion Forums. 

QUERY: I would like to know which events to use to get correct and complete solution 

 

From your query we understand that you need to show an element outside grid on selecting a row and if it satisfies certain conditions. Also, you need to hide that element on clicking outside the grid and/or navigating to another page. You have achieved this requirement by showing the element in rowSelected event and hiding it in rowDeselected and actionBegin event. You need to make sure whether the events you have used are correct or not. 

We have validated your code. Everything is fine about events. But in actionBegin event, you need to check the requestType and hide the element only when the requestType is “paging”.  

Please refer the below code snippet, 

        $(function () { 

            $("#Grid").ejGrid({ 

                dataSource: data, 

                columns: [ 

                   ------- 

                ], 

              actionBegin: "actionBegin", 

              rowSelected: "rowSelected", 

              rowDeselected: "rowDeselected", 

            }); 

        }); 

              function actionBegin(args) { 

                if(args.requestType == "paging") { 

                 //hide element 

                } 

              } 

              function rowSelected(args) { 

               //check condition and show element if the condition satisfied 

              } 

              function rowDeselected(args) { 

               //hide element 

              } 

If you have further queries, please get back to us. 

Regards, 

Padmavathy Kamalanathan 

[Petra Visic]

Thanks for answer.

Actually, I would like to hide certain element on all the events that cause deselection of a record... Clicking something outside of grid and navigating to another page are just examples. Another one is filtering in grid.

Why "rowDeselected" event is not triggered when, for example, filtering is applied in grid, or after navigating to another page? After these actions, the row that had been selected is not selected anymore, and it would make sense to me that in thoose cases the "rowDeselected" event is triggered.

[Padmavathy Kamalanathan]

Hi Petra, 

Thanks for the update. 

QUERY: Why "rowDeselected" event is not triggered when, for example, filtering is applied in grid, or after navigating to another page? 

 

From your query we understand that you are unable to hide element, since the rowDeselected event has not been triggered while filtering record. When we filter grid rows, the grid records will no longer will be the same as before filtering, and the selected record may not be present in the grid after filtering. The rowDeselected event will not be triggered.  

In order to hide element for every action(like paging, filtering etc), we suggest you to hide it in actionBegin event without checking the requestType. If you need to hide element for particular action, check requestType for that corresponding action and hide element in actionBegin event as we did in our last update. 

Please refer the below help documentation, 

https://help.syncfusion.com/api/js/ejgrid#events:actionbegin 

If you have further queries, please get back to us. 

Regards, 

Padmavathy Kamalanathan 

[Petra Visic]

Thanks for explanation.

[Manivannan Padmanaban]

Hi Petra, 

Thanks for the update. 

Kindly get back to us, if you need further assistance. 

Regards, 

Manivannan Padmanaban.