roattw Posted October 25, 2022 Report Share Posted October 25, 2022 Have a script that checks a check box if a specifc dropdown item is chosen (thanks Futurist!). If "Role" = "Resident" then an Alumni checkbox gets checked. With that, I also have a rule that says if Alumni box checked, show a field called Graduation Year. <script type="text/javascript"> document.addEventListener('DataPageReady', function (event) { const selectElement = document.querySelector('#InsertRecordRole'); selectElement.addEventListener('change', (event) => { if(selectElement.value == "Resident"){ document.querySelector("#InsertRecordAlumni").checked = true; }else{ document.querySelector("#InsertRecordAlumni").checked = false; } }); }); </script> The script does check then Alumni box when Resident chosen from dropdown. However, whesn the "script" selects the alumni checkbox it does not trigger the rule to show Graduation Year field. But if I manually uncheck the then recheck the alumni checkbox it does invoke rule to show graduation Year field. Remove the script, the rule works again. It seems like a script-applied checkbox is not seen by the RFules code as an event. Only a mnaully checked field can invoke the rule. Script checks the box (no grad year rule triggered): Manually check the box (rule triggered): Thanks everyone! Quote Link to comment Share on other sites More sharing options...
roattw Posted October 27, 2022 Author Report Share Posted October 27, 2022 Bump? ;^) Quote Link to comment Share on other sites More sharing options...
Wikiwi Posted October 28, 2022 Report Share Posted October 28, 2022 Instead of combining the the standard feature Rules and your script that is causing an issue. why not do all the logic within the script? <script type="text/javascript"> document.addEventListener('DataPageReady', function (event) { const selectElement = document.querySelector('#InsertRecordRole'); const Gradyear= document.querySelector('#InsertRecordGraduation_field'); //this is to get your graduation year field. Gradyear.style.display= "none"; //by default this field is hidden selectElement.addEventListener('change', (event) => { if(selectElement.value == "Resident"){ document.querySelector("#InsertRecordAlumni").checked = true; Gradyear.style.display= "block"; //if dropdown is Resident, alumni checkbox is checked and that also means graduation year should be visible. }else{ document.querySelector("#InsertRecordAlumni").checked = false; Gradyear.style.display= "none"; // incase a user changed the selectElement.value to another option } }); }); </script> roattw 1 Quote Link to comment Share on other sites More sharing options...
roattw Posted November 1, 2022 Author Report Share Posted November 1, 2022 Success! Thank you so much! Quote Link to comment Share on other sites More sharing options...
roattw Posted November 7, 2022 Author Report Share Posted November 7, 2022 Hoping to put a slightly different slant on this. If ROLE = Resident OR Faculty then check the Alumni box. However, only show the Gradyear if Role = Resident. Know just enough to make the call an array to check the box for Resident or Faculty, but not how to apply the resident/faculty conditionally to ResGradYEar to show: if(selectElement.value == "Resident","Faculty") I guess It could just apply the Rule then, but JS is so much more interesting. <script type="text/javascript"> document.addEventListener('DataPageReady', function (event) { const selectElement = document.querySelector('#InsertRecordRole'); selectElement.addEventListener('change', (event) => { if(selectElement.value == "Resident","Faculty"){ document.querySelector("#InsertRecordAlumni").checked = true; } else{ document.querySelector("#InsertRecordAlumni").checked = false; } }); }); </script> Then use Rule to hide Res_grad_year if Role = Resident. Quote Link to comment Share on other sites More sharing options...
kpcollier Posted November 7, 2022 Report Share Posted November 7, 2022 Try breaking out the conditions - From if(selectElement.value == "Resident","Faculty") To if(selectElement.value == "Resident" || selectElement.value == "Faculty") JS won't understand the way you wrote it, the conditions need to be explicitly laid out. || in this situation means 'or', so it will be running on If selectElement.value = Resident OR if selectElement.value = Faculty. For reference, && is the Logical AND, || is the Logical OR, and ! is the Logical NOT. roattw 1 Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.