Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
920
Filter Grid by Custom combo
posted

I need to replace the ADVANCED filter options for a column with a custom selection set.

The column data is being supplied to the grid as an integer value and reformated

{ headerText: "Role", key: "RoleID", width: "100px", dataType: "string", formatter: formatUserRoleCombo }, 

The  column is being edited via combo with datasource 'userRoleJSON' supplying integer 'Value' and string 'Name'.

I want this datasource to be used to fill the filter combo options when filtering on this combo.

The selected integer value NOT the text should be used to filter the grid.

 

I am using the code below on a loader after the grid is initialised to attempt to attach the combo to column 16.

However the combo is not being attached to any column filter.

 

Can anyone advise here.

Thank You.

 

$($('tr[data-role="filterrow"] td')[16]).append("<div id='filterUserRoleCombo'></div>");

 $("#filterUserRoleCombo").igCombo({

        dataSource: userRoleJSON,

        textKey:"Name",

        valueKey:"Value",

        mode:"dropdown",

        width:"100%",

        selectionChanged:

function (evt, ui) {

           var expressions = $("#GridTable").data("igGrid").dataSource.settings.filtering.expressions;

            $("#GridTable").data("igGrid").dataSource.settings.filtering.expressions = [];

           var newExpressions = [];

           if (expressions.length !== 0) {

               for (var i = 0; i < expressions.length; i++) {

                   if (expressions[i].fieldName !== "RoleID") {

                        newExpressions.push({

                            fieldName: expressions[i].fieldName,

                            expr: expressions[i].expr,

                            cond: expressions[i].cond

                        });

                    }

                }

            }

           

if ((ui.items !== null) && (ui.items.length === 1)) {

                newExpressions.push({

                    fieldName:"RoleID",

                    expr: ui.items[0].text,

                    cond:"equals"

                });

            }

            $("#GridTable").igGridFiltering("filter", newExpressions);

        }

    });