Cascading Select/Dropdown Fill

Hello Team,
I’m new to Frappe Framework, I have started working on converting my existing Web App (SaaS Product) to Frappe Framework.
Our one of onboarding use case is using cascaded dropdowns. We have created DocTypes

  1. Country
  2. State/Province
  3. District/County
  4. Block
  5. Area
    all of these have dependency workflow as County (Default Populated) =(On Selection)=>State/Province=(On Selection)=> District/County =(On Selection)=>Block =(On Selection)=> Area

How can we achieve this using client script on DocType of Customer Registration?

Hi,

Please try following, replace the DocType with Doctype name and field name as per your actual fields.

frappe.ui.form.on('DocType', {
    county: function(frm) {
        frm.set_query('state_province', function() {
            return {
                filters: {
                    'county': frm.doc.county
                }
            };
        });
    },
    state_province: function(frm) {
        frm.set_query('district_county', function() {
            return {
                filters: {
                    'state_province': frm.doc.state_province
                }
            };
        });
    },
    district_county: function(frm) {
        frm.set_query('block', function() {
            return {
                filters: {
                    'district_county': frm.doc.district_county
                }
            };
        });
    },
    block: function(frm) {
        frm.set_query('area', function() {
            return {
                filters: {
                    'block': frm.doc.block
                }
            };
        });
    }
});

Thanks,

Divyesh Mangroliya

1 Like

Do you mind sharing your doctypes design for those?

And any thoughts on utilizing territory doctype for this purpose?