user2314339 user2314339 - 3 months ago 9
HTML Question

Radio button values not saved when form reloads jQuery

I'm working on a way to show and hide a form with some help of jQuery and radio buttons. The show and hide part is working. In my form there is a question if i will attend the party. When clicked on the radio button yes, i can see all the personal detail fields i have to fill in ( Name, Address etc...), when i click no, all these fields are hidden.
Now when the form gets reloaded, it seems my jQuery doesn't save the value of the radio button and the personal fields will be shown, regardless yes or no. What can i change in the code so when the form gets reloaded, i keep the radio button option i selected?

I have created a fiddle to simulate the problem: https://jsfiddle.net/eo9ydcbn/2/

accepted = $('input[name*="accepted"]');

accepted.change( function() {
var input_accepted = $('input[name*="accepted"]:checked').val();
console.log(input_accepted);
if ( input_accepted == '0' ) {
$('#registerForm').collapse('hide');
}
else
{
$('#registerForm').collapse('show');
}
}).trigger('change');


All the help is greatly appreciated!

Answer

I figured it out,

Instead of using .collapse to show and hide the form, i used .show and .hide. Now it keeps my radio button settings

accepted = $('input[name*="accepted"]');

accepted.change( function() {
    var input_accepted = $('input[name*="accepted"]:checked').val();
    console.log(input_accepted);
    if ( input_accepted  == '0' ) {
        $('#registerForm').hide('slow');
    }
    else
    {
        $('#registerForm').show('slow');
    }
    }).trigger('change');