Chris Andrews replied 2 years ago

Thanks Rob, the problem I'm having is that if the toggle is turned off, everything in the repeater fields is deleted. Sometimes users just closed it to retract the repeater fields so they don't show while the rest of the form is completed... and the user only finds out later that closing the toggle erased their entries. I'm not sure if that's the way it's intended to work or not, but it's not a good user experience...

Rob LeVine replied 2 years ago

That seems crazy, so there must be something else going on. Can you send me a link to check it out? If you want to do it privately you can send me a message through this community (https://connect.formidableforms.com/messages/).

Chris Andrews replied 2 years ago

I checked in with support on this, they said it was default behavior. From support: "When a field is hidden using conditional logic, the data entered in the field is lost."

They said they have an alternative method to show/hide a section though, that doesn't delete the content. It's here: https://formidableforms.com/knowledgebase/javascript-examples/#kb-conditionally-hideshow-a-field

That code gets added to the 'after fields' section under settings > custom-html, according to the email I received.

It's jquery, as you suggested. I'm testing the code right now, and it opens the hidden field upon toggle, but once it's open, it won't close when the toggle is moved to 'no'. I'm inexperienced with jquery, it looks right to me, but something isn't working.

jQuery(document).ready(function($){
// Hide field by default
$("#frm_field_89_container").css('display','none');

$("input[name='item_meta[93][]']").change(function(){
var show;

var val1 = $("input[name='item_meta[93][]']").val();
if (val1 == 'Yes')
{show = true;}
else if (val1 == 'No')
{show = false;}

if(show){
$("#frm_field_89_container").css('display','block');
}else{
$("#frm_field_89_container").css('display','none');
}
});
});

Sorry, I don't have a way to give you a public link to the form, it's in a members only area,

Chris

Rob LeVine replied 2 years ago

Sorry, but I won't be able to debug that without seeing it for myself. You can use the browser's developer tools (F12) to debug inline or use console.log() statements to output stuff to the debug console and see what is and isn't happening.

Chris Andrews replied 2 years ago

Oh, I realized I could just recreate it on a public page, I dumped all the rest of the form so we only have to look at the actual problem - It opens okay, just won't close now. I appreciate your help with this Rob!

Rob LeVine replied 2 years ago

Try this instead. The "value" is always "Yes", regardless so you really can't use that. Note: Even though it looks like the logic is backward (false => show and true => hide) it's because the "aria-checked" attribute doesn't change until the toggle change action is complete.

jQuery(document).ready(function($){
$("#frm_field_104_container").css('display','none');
$("input[name='item_meta[103][]']").change(function(){
var show;
var val1 = $("#field_dzahx2").next().attr("aria-checked");
if (val1 == 'false')
{show = true;}
else if (val1 == 'true')
{show = false;}
if(show){
$("#frm_field_104_container").css('display','block');
}else{
$("#frm_field_104_container").css('display','none');
}
});
});

Chris Andrews replied 2 years ago

That is working PERFECTLY!!!

Thank you so much for your help with this Rob, I really appreciate it!

Chris