We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Cannot see Tick Mark in Grid Excel Type Filter

Hi there,

I was messing around with the Grid paging theme and seem to have broken the Excel Type grid filter.

I cannot see the tick marks but there are there because I can filter by them.

I have probably messed up some css? Please point me in the right direction to where I can look?

Neill

3 Replies

TS Thavasianand Sankaranarayanan Syncfusion Team June 6, 2017 04:09 PM UTC

Hi Neill, 

Thanks for contacting Syncfusion support. 

Before proceeding your query we need some more details. 

  1. Share the screen shot or video demonstration of your expectation.
  2. Share your expectation which is need to show in Grid.
  3. Share the css file that you have applied for the Grid pager.
  4. Share Grid Code example.
  5. Essential Studio version.

Regards, 
Thavasianand S. 



NE Neill June 7, 2017 07:57 AM UTC

Hi Thavasianand,

1. How it looks - "HowItLooks.png"
2. How it should look - "HowItShouldLook.png"
3. CSS - As far as I can tell I only add the following to styles.css

     .custom .e-excelIcon {
        font-size: 30px;
    }

    .custom .e-tooltxt {
        width: 50px;
    }


    .e-grid .e-groupdroparea, /*GroupDropArea */

    .e-grid .e-groupdroparea:hover, /*GroupDropArea Hover*/

    .e-grid .e-cloneproperties, /*Column header clone during dragging header*/

    .e-grid .e-groupheadercell:hover, /*HeaderCell in GroupDropArea*/

    .e-grid td.e-active, /*During Row Selected*/

    /*For pager items and their hover*/

    .e-pager .e-currentitem,

    .e-pager .e-currentitem:hover,

    .e-pager .e-link:hover,

    .e-pager .e-icon:hover {

        background-color: gray;
    }

4. Grid Code:
    $('#mainContent').ejGrid({
                                dataSource: formatData,
                                isResponsive: true,
                                enableResponsiveRow: true,
                                allowSorting: true,
                                allowResizing: true,
                                allowPaging: true,
                                pageSettings: { pageSize: '@ViewBag.PageSize' },
                                allowFiltering: true,
                                filterSettings: { filterType: "Excel" },
                                allowGrouping: true,
                                groupSettings: { groupedColumns: ['@ViewBag.GroupByColumn'] },
                                columns:
                                    [
                                        { field: "Id", headerText: "ID", isPrimaryKey: true, headerTextAligh: "right", width: 30 },
                                        { field: "SerialNumber", headerText: "Serial Number", width: 60 },
                                        { field: "LinkStation", headerText: "Link Station", width: 50 },
                                        { field: "DateLinked", headerText: "Date Linked", priority: 2, format: "{0:dd/MM/yyyy}", width: 40 },
                                        { field: "UnlinkStation", headerText: "Unlink Station", width: 60 },
                                        { field: "DateUnlinked", headerText: "Date Unlinked", priority: 2, format: "{0:dd/MM/yyyy}", width: 40 },
                                        { field: "LinkUser", headerText: "User", width: 60 }
                                    ],
                                recordClick: "RecordClick",
                            });

5. Version 13.4.0.63


So yes the problem is that the tick marks in the grid filter are invisible.

Thank you.

    

Attachment: Syncfusion_130823_4d7f8c22.zip


MS Mani Sankar Durai Syncfusion Team June 8, 2017 06:40 AM UTC

Hi Neill, 

A support incident has been created under your account to track the status of this requirement. Please log on to our support website to check for further updates.   
 
Regards,   
Manisankar Durai 


Loader.
Live Chat Icon For mobile
Up arrow icon