Current filter:
                                You should refresh the page.
                                  • Hello,

                                    We have two columns 'Department' and 'Category' with the filter row enabled. In the filter row and edit form these are both dxSelectBox.

                                    It's fine for the Edit form as we can determine the 'Department' in onEditingStart and pass this to the function in the lookup at column level.

                                    The requirement we have is within the filter row to limit the 'Category' selectbox options depending on what option is selected in the 'Department' selectbox.

                                    Can we Filter column depending on another filter?

                                    Or can we convert the filter row into a dxTextbox ? with the same behaviour as our other non lookup column 'Template Name', searchable string, uses contains by default, has a little magnifying glass that when clicked changes the filterOperation. Partial matches accepted and updates column in real time.

                                    Please can you recommend a solution to this problem?

                                    Thanks,

                                    Keith.

                                1 Solution

                                Creation Date Importance Sort by

                                Hello Keith,

                                We discussed a similar task in the How to implement cascading lookups in the filter row and header filter ticket.

                                Please let s know if the solution from that ticket helps.

                                Regards,
                                Romeo

                                UPDATED BY Alessandro (DevExpress Support Team):

                                You can use the same approach for the editors located in the Filter Row. Handle the onEditorPreparing and onEditorPrepared events to access these editors and implement the filtering behavior for the secondary editor once the primary editor value is updated:

                                [JavaScript]
                                onEditorPreparing: function(e) { if(e.parentType === "filterRow" && e.dataField === "StateID") { e.editorOptions.onValueChanged = function (arg) { filterEditor.option("dataSource", { store: cities, filter: ["StateID", "=", arg.value] }); e.setValue(arg.value); }; } }, onEditorPrepared: function(e) { if(e.parentType === "filterRow") { if (e.dataField === "CityID") { filterEditor = e.editorElement.dxSelectBox("instance"); } } },

                                Complete example: https://codepen.io/Alex969/pen/vozOoO. I hope this information helps.

                                • Customer68796 08.08.2019

                                  Hi Romeo,

                                  Thanks, that shows me how to determine the selected Department from the filter row select box , however I'm still unsure of how to populate my Category filter row select box using this.

                                  Below is the code used to populate my category select box in the edit form.

                                  [C#]
                                  { dataField: 'Category', alignment: "center", sortOrder: "asc", sortIndex: "1", validationRules: [{ type: "required" }], lookup: { dataSource: function (e) { var selectBoxData = []; $.ajax({ url: '@Url.Action("GetCategories", "Template")', dataType: "json", data: { 'dept': e.data ? ["Department", "=", e.data.Department] : null }, async: false, success: function (result) { selectBoxData = result; } }); return selectBoxData; } } }
                                  [C#]
                                  function PopulateCategorySelectBox() { var categorySelectBoxData = []; $.ajax({ url: '@Url.Action("GetCategories", "Template")', data: { 'dept': liveDepartment }, async: false, success: function (result) { categorySelectBoxData = result; } }); $(function () { $("#category").dxSelectBox({ dataSource: categorySelectBoxData }); }); }

                                  I don't think I can use "childLookup.getDataSource().filter" in my solution with this datasource?

                                  Thanks,

                                  Keith.

                                • Alessandro (DevExpress Support) 08.09.2019

                                  Hi,

                                  I have modified our original answer. Please review it.

                                • Customer68796 08.09.2019

                                  Thanks very much, I got it working after reviewing your code! :)

                                  Enjoy the weekend!

                                  [C#]
                                  onEditorPreparing: function (e) { if (e.parentType === "filterRow" && e.dataField === "Department") { e.editorOptions.onValueChanged = function (arg) { $.ajax({ url: '@Url.Action("GetCategories", "Template")', data: { 'dept': arg.value }, async: true, success: function (result) { filterEditor.option("dataSource", result); e.setValue(arg.value); } }); }; } }, onEditorPrepared: function (e) { if (e.parentType === "filterRow" && e.dataField === "Category") { filterEditor = e.editorElement.dxSelectBox("instance"); } }
                                • Alessandro (DevExpress Support) 08.12.2019

                                  It is good news that the problem has been resolved. Thank you for letting us know about your progress. Please feel free to contact us if you have any further difficulties. We will be happy to assist you.