How can show more then 5 column in dialog child table

Frappe Framework
, , , ,
1

Hello,

i created a frappe dialog with child table and this child table have 11 fields all all fields have “in_list_view”: 1. but when i open this dialog this show only 5 fields as per below image but i want 8 fields or column in this child table.

how can i do this ?

image
image902×500 25.6 KB

1 Like
2

Dear @pithiya_Nilesh ,

To display more fields in the child table within your Frappe dialog, you can adjust the column width and ensure that the fields are properly configured.

Here are some steps you can follow…

  1. Adjust Column Width - Ensure that the columns are not too wide. You can set the width of each column to make sure more columns fit into the view. This can be done by setting the width property for each field in the child table.

  2. Check Field Configuration - Make sure that the “in_list_view” property is set to 1 for the fields you want to display. It seems you have already done this, but double-check to ensure there are no typos or misconfigurations.

  3. Custom CSS - If the above steps do not work, you can use custom CSS to adjust the layout and ensure more columns are visible. Add a custom CSS class to the dialog and define the styles accordingly.

let d = new frappe.ui.Dialog({
    title: 'Enter details',
    fields: [
        {
            fieldname: 'child_table',
            fieldtype: 'Table',
            label: 'Child Table',
            in_place_edit: true,
            fields: [
                { fieldname: 'field1', label: 'Field 1', fieldtype: 'Data', in_list_view: 1, width: '10%' },
                { fieldname: 'field2', label: 'Field 2', fieldtype: 'Data', in_list_view: 1, width: '10%' },
                { fieldname: 'field3', label: 'Field 3', fieldtype: 'Data', in_list_view: 1, width: '10%' },
                { fieldname: 'field4', label: 'Field 4', fieldtype: 'Data', in_list_view: 1, width: '10%' },
                { fieldname: 'field5', label: 'Field 5', fieldtype: 'Data', in_list_view: 1, width: '10%' },
                { fieldname: 'field6', label: 'Field 6', fieldtype: 'Data', in_list_view: 1, width: '10%' },
                { fieldname: 'field7', label: 'Field 7', fieldtype: 'Data', in_list_view: 1, width: '10%' },
                { fieldname: 'field8', label: 'Field 8', fieldtype: 'Data', in_list_view: 1, width: '10%' }
            ]
        }
    ],
    size: 'large',
    primary_action_label: 'Submit',
    primary_action(values) {
        console.log(values);
        d.hide();
    }
});

d.show();
3

Thanks @Kabir for response i try this but not working for me.

4

Dear @pithiya_Nilesh

Can you try changing the % - from 10% to 7% and see if it works.

We are only over-riding the default CSS to allow more columns. Nothing else.

If this doesn’t resolve the issue, you might need to look into customizing the Frappe framework itself