We currently use JQWidgets jqxGrid to render our grids. We have been asked if it's possible to add a DropDownList filter in a column that checks if that row contains the value of the selected item in the list.
Example:
DropDownList:
{ Label: "Frank's Mazda", Id: 1 } { Label: "Frank's Ford", Id: 6 } { Label: "Satellite Location", Id: 4 }
Location Row: (a List of locations separated by a comma rendered using server side pagination)
Row 1: LocationColumn = "Frank's Mazda, Frank's Ford" Row 2: LocationColumn = "Frank's Mazda, Frank's Ford" Row 3: LocationColumn = "Frank's Mazda, Satellite Location"
Normally, we use the dropdownList filter for jqxGrid is a one-to-one relation. Meaning that if Id matches the data brought in the grids (example, locationId = 6), then it will apply the label of Id 6 to respective row in the grid (in this case, "Frank's Ford")
We want modify the logic of the dropdownlist to match if id of LocationColumnId CONTAINS the selected item in the dropdown list, then display all locations separated by a comma instead of showing the same item in the dropdown List.
Once LoadCompleted function is called, here is the logic of how we add the jqxGrid dropDownFilter:
if (GridColumns[xxx]["filtertype"] == "list") { // GridColumns is the Column data brought from the Server to initialize jqxGrid. This if statement is inside a For loop to check all columns. [xxx] is the number of iteration.
GridColumns[xxx]["filteritems"] = getSimpleAdapter(GridColumns[xxx]["filterlist"], "Id", "Label");
GridColumns[xxx]["displayfield"] = GridColumns[xxx]["datafield"] + "Source";
GridColumns[xxx]["createfilterwidget"] = function (column, htmlElement, editor) {
editor.jqxDropDownList({ displayMember: "Label", valueMember: "Id" });
if (editor.jqxDropDownList("width") < 250) {
editor.jqxDropDownList({ dropDownWidth: 250 });
}
};
Mock example: enter image description here
We tried use string and adding Contains for the grid, but it brings the label from the dropdownlist instead of display the list of locations string separated by comma rendered in the class from the Server. This is using MVC .NET Framework 4.7 C#.
Is there a way to accomplish this with the same filter list of the column in the grid?