Filter Child Table Records

Frappe Framework App Development
1

Hello.
I’d like to display only a subset of child table records when a button is clicked.
For example, Say I have a ‘Customer’ Doctype and an associated ‘CustomerOrders’ child DocType. When I open the ‘Customer’ DocType, all ‘CustomerOrders’ child records are displayed in the child table grid. But I’d like to add a custom button (‘Show Incomplete Orders’). When I click this button I want to display only the ‘CustomerOrders’ records with a status of ‘Incomplete’ (and hide all the other CustomerOrders records). Has anyone done something like this? How?

2

In my case, there is a text field to search the records

var search = cur_frm.doc.search_by_name.toLowerCase().replace(/ /g, '');
            for (var i = 0; i < table.length; i++) {
                uid = table[i].unique_identity_code.toLowerCase().replace(/ /g, '');
                var condition = uid.includes(search)
                if (condition == true) {
                    $("[data-name='" + table[i].name + "']").show()
                } else {
                    $("[data-name='" + table[i].name + "']").hide()
                }
            }

Filter_item_example
Filter_item_example1220×646 39.2 KB

I hope you find useful

3 Likes
3

Thanks ROHAN_JAIN1!

That worked like a charm! I’ve adapted your code for my requirement as follows:

frappe.ui.form.on('Customer', {
    refresh: function(frm) {
            cur_frm.add_custom_button(__('Show Incomplete Orders'),
            function() { 
                let table = frm.doc.customer_orders;
                for (var i = 0; i < table.length; i++) {
                    let is_complete = table[i].is_complete;
                    if (is_complete == 1) {
                        $("[data-name='" + table[i].name + "']").hide();
                    } else {
                        $("[data-name='" + table[i].name + "']").show();
                    }
                }
            });

        }
    })
4 Likes