CODEWITHSUNDEEP
javascriptphpjqueryhtmlforms
Xeen
Xeen

Reputation: 7003

Radio buttons not submiting

$(".dist_radio").click(function(event) {
        event.preventDefault();
        $(".dist_radio").removeClass('dist_on');
        $(".dist_radio").children('input').attr('checked', false);
        $(this).addClass('dist_on');
        $(this).children('input').attr("checked", true);
    });

is the way I'm handling custom styled radio buttons and everything is fine if I click on a single radio (#1) and submit the form - it's being sent without errors (note that I'm having my form submit in a new window), if I chose another radio button (#2) and submit the form - again, the given radio is being sent with no issues, but if I then click back on the previously submitted radio button (#1), I get a validation error that I haven't chosen any radio button even though by checking the element with firebug, I can see that it has checked="checked" set.

Why is that and what can I do to fix it?

Upvotes: 0

Views: 86

Answers (3)

Edgar A.Franco
Edgar A.Franco

Reputation: 37

Stumbled along with this issue and spent hours solving it. This is why:

.prop() vs .attr()

Upvotes: 0

Reshma
Reshma

Reputation: 1

The transition from one slide to the next is handled by your submitHandler, so the radio buttons need to do is submit the form on click, with that in mind:

$('input[type=radio]').click(function() {
    $(this).closest("form").submit();
});

Upvotes: 0

Anton
Anton

Reputation: 32581

Use .prop() instead of .attr() for property values

$(".dist_radio").click(function(event) {
    event.preventDefault();
    $(".dist_radio").removeClass('dist_on');
    $(".dist_radio").children('input').prop('checked', false);
    $(this).addClass('dist_on');
    $(this).children('input').prop("checked", true);
});

Upvotes: 1

Related Questions