Grid filter items are disabled

[John Fleet]

Hi,

I am creating a Datatable and populating it with data from SQL and other processing and then binding the grid datasource with the populated datatable as follows

        Grid6.DataSource = dt

       Grid6.DataBind()

The grid has correct data showing and filter is populated with items, but the items are disabled.

Can you please advise how to enable items in filter !

Regards,

John

Attachment: filter_issue_aaba47ec.zip

[Manivannan Padmanaban]

Hi John,

Greetings from Syncfusion Support.

Before we proceed with your query, we would like to confirm the following details which will help us to validate and provide the solution as early as possible.

1. Share the Essential Studio Version.
2. Share the complete grid rendering code (both client and server end)
3. Confirm whether are you performing any custom actions using grid events. If yes, please share those details.

Regards,

Manivannan Padmanaban

[John Fleet]

Thank you for your reply.

To answer your questions:

1 I am using Visual Studio 2019 Preview  (VB.Net and ASP.Net). Note that Visual Studio 2022 does not support 32bit OLEDB.

The Syncfusion references are:

Syncfusion.EJ.Web, Version=20.2460.0.50

Syncfusion.EJ, Version=20.2460.0.50

2. Please see my attached code files ... the Grid with problem is Grid6. The DataTable is being populated in 

    Protected Sub GetFixturesScoresAndPlayerScores(ByVal sThisTeam As String)

3. Custom grid events are as follows: (Grid6)

<ClientSideEvents QueryCellInfo="queryCellInfo" RowDataBound="rowDataBound3" />

         <script>

             function queryCellInfo(args) {

                 if (args.column.field == "FixtureHomeScore" && (args.rowData["FixtureHomeScore"] > args.rowData["FixtureAwayScore"]))

                     $(args.cell).css("background-color", "#8FBC8F").css("color", "darkblue")

                 else if (args.column.field == "FixtureAwayScore" && (args.rowData["FixtureAwayScore"] > args.rowData["FixtureHomeScore"]))

                     $(args.cell).css("background-color", "#8FBC8F").css("color", "darkblue")

                 else if (args.column.field == "FixtureHomeScore" && (args.rowData["FixtureHomeScore"] == args.rowData["FixtureAwayScore"]))

                     $(args.cell).css("background-color", "#FEF9E7").css("color", "blue")

                 else if (args.column.field == "FixtureAwayScore" && (args.rowData["FixtureAwayScore"] == args.rowData["FixtureHomeScore"]))

                     $(args.cell).css("background-color", "#FEF9E7").css("color", "blue")

                 if (args.column.field == "FixtureHomeScore") {

                     var value = args.cell.textContent

                     if (value == 1) { args.cell.textContent = " " }

                     else if (value == 2) { args.cell.textContent = "Win" }}

                 else if (args.column.field == "FixtureAwayScore") {

                     var value = args.cell.textContent

                     if (value == 1) { args.cell.textContent = " " }

                     else if (value == 2) { args.cell.textContent = "Win" }}}

         </script>

          <script type="text/javascript">

                    function rowDataBound3(args) {

                        if (args.data.FixtureHomeScore < 1) { args.row.css("backgroundColor", "whitesmoke").css("color", "darkblue") }

                        else { args.row.css("backgroundColor", "#D4EFDF").css("color", "darkblue") }

                    }

         </script>

Hope this helps !

Regards,

John

Attachment: Grid6_filter_problem_7b49f0c5.zip

[Farveen Sulthana Thameeztheen Basha]

Hi John Fleet,

We are working on your reported problem from your provided details and will get back to you by on or before 31^st October 2022. Until then we appreciate your patience.

Regards,
Farveen sulthana T

[John Fleet]

Thank you Farveen, much appreciated :)

[John Fleet]

If it helps, see this issue live by doing the following:

1. Go to https://www.newtonabbotanddistrictskittlesleague.org.uk/

2. use 'My Team' menu option and select any Team.

3. Filter by 'Match Type' or any other filter for that grid.

Anything you try to select in the filter is not checked and the filter does not seem to work correctly.

[Farveen Sulthana Thameeztheen Basha]

Hi John Fleet,

Thanks for your provided details.

We are able to replicate the problem from your provided details.
This problem occurs due to CssClass bound to Accordion component which affects the span icon of the Filtered Checkbox in Grid. To overcome this problem, we suggest you to use the below CSS to enable the filtered Items.

Refer to the code below:-

<ej:Accordion ID="Accordion1" runat="server" Width="1362" Height="" CssClass="customCss" Visible="true">

                    <Items>

                       <ej:AccordionItem ID="AccordionItem1" runat="server" Text="Your Team">

                               <ContentSection>

 

                                            .  .    .

                            </ContentSection>

                 </ej:AccordionItem>

        </Items>

</ej:Accordion>

 

<style>

    .customCss h3 {background-color: palegoldenrod  !important;}

    .customCss h3 {text-emphasis-color :darkblue}

    .customCss h3 a{color:darkblue !important;}

    .customCss span.e-icon {display: none !important;}   //causes reported problem

    .customCss .e-grid span.e-icon {display: unset !important;} 

</style>

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

Regards,

Farveen sulthana T

Note:-  If this post is helpful, please consider Accepting it as the solution so that other members can locate it more quickly.

[John Fleet]

Thank you for your help !!!

[Farveen Sulthana Thameeztheen Basha]

Hi John Fleet,

Thanks for your update. Please get back to us if you need any further assistance. We are happy to assist you further.

Regards,
Farveen sulthana T