How to change button color in frappe.ui.Dialog

I just want to change color of primary action button

let d = new frappe.ui.Dialog({
title: 'Enter details',
fields: [
    {
        label: 'First Name',
        fieldname: 'first_name',
        fieldtype: 'Data'
    },
    {
        label: 'Last Name',
        fieldname: 'last_name',
        fieldtype: 'Data'
    },
    {
        label: 'Age',
        fieldname: 'age',
        fieldtype: 'Int'
    }
],
primary_action_label: 'ACCEPT',
primary_action(values) {
    console.log(values);
    d.hide();
}
});

d.show();

How to change ACCEPT Button color to Green?

You can add something like this before d.show()

dialog.$body.find(‘button[data-fieldtype=“Button”]’).addClass(‘btn-secondary’);

This will add btn-secondary class to all buttons in dialog. You can tweak it to change primary button color. Also you can use any css class of your choice.

Thank you, i will check this

Try:

dialog.$body.find('button[data-fieldname="fieldname"]').addClass('btn-danger');
1 Like