How to make drop-down fields named State and City works in the Doctype list view and filters?

the solution here is totally correct
https://docs.erpnext.com/docs/user/manual/en/filter-options-in-select-field

frappe.ui.form.on("Lead", "state", function(frm) {
  if(frm.doc.state == "Karnataka")
  {
    set_field_options("city", ["Bangalore","Mysore"])
  }
  else if(frm.doc.state == "Maharashtra")
  {
    set_field_options("city", ["Mumbai","Pune"])
  }
  else if(frm.doc.state == "")
  {
    set_field_options("city", ["","Bangalore","Mysore","Mumbai","Pune"])
  }
  });

but when i want this in the list view of related Doctype its not working!
i tried this

created mydoctype_list.js and added the following script:

frappe.listview_settings['mydoctype] = {
    onload: function(listview) {
        // Add an event listener to the State filter field
        listview.page.add_inner_button(__("Refresh"), function() {
            var stateFilterValue = frappe.query_report_filters_by_name['state'].get_value();
            var districtFilterField = frappe.query_report_filters_by_name['district'];

            // Set the options based on the selected gov value
            if (stateFilterValue === 'a') {
                districtFilterField.df.options = ['1','2','3','4','5'];
            } else if (govFilterValue === 'b') {
                districtFilterField.df.options =['6','7','8','9','10'];
            } else {
                districtFilterField.df.options = [];
            }

            // Refresh the filter field
            districtFilterField.refresh();
        });
    }
};

only refresh button appeared but the district values did not appeared !!!

any help please?

Hi @tayeb_rashed,

If it’s a link field, we can do it. It’s hard to put a filter in an option field, and we’re not sure if it can be done.

Please check it. we apply the filter on the link within version 15. but it’s a temporary solution.

Script:

frappe.listview_settings['Test DocType'] = {
    onload: function(listview) {
        if (listview.page.fields_dict.state && listview.page.fields_dict.city) {
            listview.page.fields_dict.state.$input.on('change', function() {
                var state = listview.page.fields_dict.state.get_value();

                if (state === "State A") {
                    listview.page.fields_dict.city.get_query = function() {
                        return {
                            filters: [
                                ["name", "in", ["City AA", "City AB"]]
                            ]
                        };
                    };
                }
                if (state === "State B") {
                    listview.page.fields_dict.city.get_query = function() {
                        return {
                            filters: [
                                ["name", "in", ["City BA", "City BB"]]
                            ]
                        };
                    };
                } 
                if (!state) {
                    listview.page.fields_dict.city.get_query = function() {
                        return {
                            filters: [
                                ["name", "in", ["City AA", "City AB", "City BA", "City BB"]]
                            ]
                        };
                    };
                }

                listview.refresh();
            });
        }
    }
};

You can customize the condition according to the scenario, and you also have to apply the some logic.

Thank You!