Hello,
I have enabled selection with check-boxes in Ignite Grid. The check-box appears in header at the left most column of the Ignite Grid. However, my requirement is to show a drop-down in place of the check-box in the header. How can I achieve this?
Regards,
Arfan Baig
Hello Angel,
Thanks for taking time to write back.
Actually, I have enabled the selection feature and the paging feature on my Grid. The check-box in header can only be used to select/deselect grid records from the current page. However, I need to provide the support for selection of grid records accross all the pages. So, I need to show a drop down with the following options:
->Select Current Page --> this option will select check boxes in current page.
->Select Across Pages --> this option will select the check boxes in the current page as well as set a value in the hidden field to indicate the selection across all pages
->None --> this option shall undone the selection
Hope, I have explained what I want to achieve through the drop down in place of check-box in the header. Moreover, if you want to see a visual of my requirement, then please see the email selection feature in Gmail.com.
hi Arfan,
could you post some drawing or screenshot which demonstrates what you would like to achieve? What would this dropdown bind to ? is your requirement to select from the dropdown, or do something else?
Thank you
Angel
Hello Arfan,
You can use the igGrid.headerRendered event. This event fires after the igGrid header is rendered. The ui.table parameter holds a reference to the header TABLE element. Having the header table you should hide the checkbox and then inject your drop-down DOM elements. Finally you have to expand the row selectors column width.
Attached you can find a sample demonstrating this approach.
Hope this helps, Martin Pavlov
Infragistics, Inc.