Unable to Hide "Submit Salary Slip" Button with Client Script

I am trying to hide Submit Salary Slip button using this Client Script:

frappe.ui.form.on('Payroll Entry', {
	onload(frm) {
	    if (frm.doc.salary_slips_submitted || (frm.doc.__onload && frm.doc.__onload.submitted_ss)) {
            this.add_bank_entry_button(frm);
        } else if (frm.doc.salary_slips_created && frm.doc.status != 'Queued') {
            if(frm.doc.first_approval_status == 'Approved' && frm.doc.second_approval_status >= 2 && frm.doc.final_approval_status == 'Approved'){
                frm.add_custom_button(__("Submit Salary Slip"), function() {
                    payrollEntryHandler.submit_salary_slip(frm);
                }).addClass("btn-primary");
            }
        }
	}
})

But the button fails to hide even though none of the conditions are met. Did I miss anything? Any help will be appreciated.

Hi @flexy2ky,

$("button[data-label = 'Submit%20Salary%20Slip']").hide();

Please set script according to your scenario.

Thank You!

1 Like

Thanks for the suggestion. I updated the script like this:

frappe.ui.form.on('Payroll Entry', {
    refresh(frm) {
        $("button[data-label = 'Submit%20Salary%20Slip']").hide();
        if (frm.doc.salary_slips_created && frm.doc.status != 'Queued') {
            if(frm.doc.first_approval_status == 'Approved' && frm.doc.second_approval_status >= 2 && frm.doc.final_approval_status == 'Approved'){
                $("button[data-label = 'Submit%20Salary%20Slip']").hide();
                });
            }
        }
    }
})

But it did not work. what did I get wrong?

I haven’t any idea below condition but

I think you want like if approved then show the button, right?

If yes, then apply it.

$("button[data-label = 'Submit%20Salary%20Slip']").show();

Also, set your approval (if condition) according to your scenario.

Thank You!

1 Like

@NCP Thanks a lot for your help. I applied the script as recommended:

frappe.ui.form.on('Payroll Entry', {
	refresh(frm) {
		$("button[data-label = 'Submit%20Salary%20Slip']").hide();
		if(frm.doc.first_approval_status == 'Approved' && frm.doc.second_approval_status >= 2 && frm.doc.final_approval_status == 'Approved'){
		    $("button[data-label = 'Submit%20Salary%20Slip']").show();
		}
	}
})

And the button was hidden as expected but the button remained hidden even though the condition had been met. I then hid the button inside the condition:

frappe.ui.form.on('Payroll Entry', {
	refresh: function(frm) {
		if (frm.doc.first_approval_status == 'Approved' && frm.doc.second_approval_status >= 2 && frm.doc.final_approval_status == 'Approved') {
			frm.page.show_menu_item('Submit Salary Slip');
		} else {
			frm.page.hide_menu_item('Submit Salary Slip');
		}
	}
});

but the button remains hidden regardless. what did I miss?

This worked actually. the issue I kept having was mistyped field name in my conditions. as soon as I fixed that I got the action I wanted. Thanks for your help.