More precisely, what is wrong with the following code, which makes it so that fields will disable int the Faculty button only if I've double-clicked the Department button first?
I've attached as a codepen for full context
$("#fac-button").on('click', function (e) {
if($(".fName").is(":disabled")){$(".fName").prop("disabled", false)}
if($(".lName").is(":disabled")){$(".lName").prop("disabled", false)}
if($(".empId").is(":disabled")){$(".empId").prop("disabled", false)}
if($(".headC").is(":enabled")) {$(".headC").prop("disabled", true)}
if($(".startDate").is(":disabled")) {$(".startDate").prop("disabled", false)}
if($(".stillEmployed").is(":disabled")) {$(".stillEmployed").prop("disabled", false)}
if($(".endDate").is(":disabled")) {$(".endDate").prop("disabled", false)}
Any help would be great, thanks
There is NEVER a need for an if when you have something that takes a boolean.
In your case just negate the boolean
$("#fac-button").on('click', function(e) {
["fname", "lName", "empId", "headC", "startDate", "stillEmployed", "endDate"]
.forEach(sel => {
const elem = document.querySelector("." + sel);
elem.disabled = !elem.disabled;
})
})
You can add
$(".headC").removeAttr("disabled")
if needed