I have found the following script to hide the 'next' button on my formidable multi-step form radio button field ID '18' unless 'Yes' is selected. However, I also want it to hide the next button for some other field IDs too e.g:
Field ID: 64 - Value: second Field ID: 35 - Value: five
How would I adapt the script below to work for multiple fields/values?
<script>
jQuery(document).ready(function($){
var fieldID = 6;
var showVal = 'gas';
var $nextButton = $(".frm_button_submit");
if (($("input[name^='item_meta[" + fieldID + "]']:checked").val() != showVal) && ($("input[type=hidden][name^='item_meta[" + fieldID + "]']").val() != showVal)) {
$nextButton.css('visibility','hidden');
}
$("input[name^='item_meta[" + fieldID + "]']").change(function(){
if ($("input[name^='item_meta[" + fieldID + "]']:checked").val() == showVal){
$nextButton.css('visibility','visible');
} else {
$nextButton.css('visibility','hidden');
}
});
});
</script>
Any help is really appreciated as I don't know how to code JavaScript. Thanks.
You can use an array to store fieldIds and showVals. Important to note is each index should have a corresponding fieldId and showVal value,. like
var fieldID = [18, 64, 35]; // add more ids here
var showVal = ['yes','text1','text2'];
The iterate the whole logic for each fieldId like
for (i in fieldID) {
...
}
Updated your code below with the logic
jQuery(document).ready(function($) {
var fieldID = [18, 64, 35];
var showVal = ['yes','text1','text2'];
var $nextButton = $(".frm_button_submit");
for (i in fieldID) {
if (($("input[name^='item_meta[" + fieldID[i] + "]']:checked").val() != showVal[i]) && ($("input[type=hidden][name^='item_meta[" + fieldID[i] + "]']").val() != showVal[i])) {
$nextButton.css('visibility', 'hidden');
}
$("input[name^='item_meta[" + fieldID[i] + "]']").change(function() {
if ($("input[name^='item_meta[" + fieldID[i] + "]']:checked").val() == showVal[i]) {
$nextButton.css('visibility', 'visible');
} else {
$nextButton.css('visibility', 'hidden');
}
});
}
});