jQuery UI Widgets Forums Grid Can we use excel style filter and normal filter in same grid ?

Tagged: , ,

This topic contains 2 replies, has 2 voices, and was last updated by  Bhavin 6 years, 8 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author

  • Bhavin
    Participant

    I’m using Angular-5 Grid.

    My question is that can we use excel style filter and normal filter in same grid?

    <jqxGrid #eventlogGrid 
                  [width]="'100%'" [source]="dataAdapter" [filtermode]="'excel'" [columns]="columns"
                  [sortable]="true" [filterable]="true" [pageable]="true" 
                  [enabletooltips]="true" [columnsautoresize]="true" [columnsresize]="true" [columnsreorder]="true" [autoshowfiltericon]="true"
                  [autoshowfiltericon]="true" [columnmenuopening]="columnmenuopening" (onRowclick)="Rowclick($event)">
              </jqxGrid>

    Here in this grid [filtermode]="'excel'" and [filterable]="true" can we use both in one grid ?

    Image with filtermode = ‘excel’

    Image with Excel

    Image with normal Filter (without Excel)
    Image with out filter

    So, As per above images can we use both filter in same grid. Because when I tried to use both filter at same time it only show excel filter.


    Martin
    Participant

    Hello Bhavin,

    Yes, your can use different type of filters for each column.
    You should pass ‘filetype’ property to the columns, instead of the attribute in the html:

    columns: any[] =
        [
            { text: 'First Name', datafield: 'firstname', filtertype: 'list', width: 160 },
            { text: 'Last Name', datafield: 'lastname', filtertype: 'list', width: 160 },
            { text: 'Product', datafield: 'productname', filtertype: 'checkedlist', width: 170 },
            { text: 'Order Date', datafield: 'date', filtertype: 'date', width: 160, cellsformat: 'dd-MMMM-yyyy' },
            { text: 'Quantity', datafield: 'quantity', width: 80, cellsalign: 'right' },
            { text: 'Unit Price', datafield: 'price', cellsalign: 'right', cellsformat: 'c2' }
        ];
    

    Here is a Demo that shows how it is used.

    Best Regards,
    Martin

    jQWidgets Team
    http://www.jqwidgets.com/


    Bhavin
    Participant

    Thank you Martin.
    It worked.

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.