Hello everyone, I'm a bit rusty with my JS skills but I'm trying to tackle creating some functions that will work on the client side rather than relying on server code. Here's what I'm attempting to achieve:
I have a dropdown control and a textbox. The textbox is initially disabled and its state is dependent on the value selected from the dropdown.
My goal is to trigger a function that will enable the textbox for text entry when "YES" is selected from the dropdown. Here is the code snippet I am working with:
function DependentControlByDropDown(sender, Control, DependentControlID) {
try {
var senderControl = sender.selectedOptions[0].text;
var controlEnable = (senderControl == Control);
console.log(controlEnable);
var control = document.getElementById(DependentControlID); // This returns NULL when I do console.log(control)
DependentControlID.disabled = controlEnable; // controlEnable has a value of either TRUE or FALSE, but it doesn't affect DependentControlID
}
catch (e) {
alert("DependentControlByDropDown : " + e.message);
}
}
I'm invoking this function in the dropdown like this:
onchange="DependentControlByDropDown(this,'Yes','txtbox1')"
When testing, I can see that I'm getting the correct value 'Yes' or 'No'. However, the issue lies with the dependent control. Even though console.log(DependentControlID) shows me the correct control, setting disabled=false does not work. I also tried
document.getElementByID(DependentControlID).disabled=false