jquery check for checked input

Question

I have few radio inputs with unique id's. Now i have a script that shows some extra content if one of them is checked. It works. But i want to clear that extra content when i check another radio input. This code don't work is i thought. It is not clearing that extra content.

 $(document).ready(function () {
    $("#delivery_option_5_1").change(function () {
        if ($(this).attr("checked")) {
            $(".delivery_options").after("<p id='extracontent'>Hello!</p>");
        }
        else {
            $("#extracontent").remove();
        }
    });
});

You should be using `if ( this.checked ) { ...`, the attribute will never change when you check the box. — adeneo, Nov 26 '14 at 10:57
My html doesn't matter because i need to do this without editing anything in html, html is generated by prestashop. — Jakub M, Nov 26 '14 at 11:11
@MohitArora ok but im kinda newbie. How can i select all other radio inputs except that one that triggers $(".delivery_options").after() function ? — Jakub M, Nov 26 '14 at 11:16

score 1 · Answer 1 · answered Nov 26 '14 at 11:19

1

Just always delete it before you add a new one. Also use prop instead of attr.

$(document).ready(function () {
    $("#delivery_option_5_1").change(function () {

        $("#extracontent").remove();

        if ($(this).prop("checked")) {
            $(".delivery_options").after("<p id='extracontent'>Hello!</p>");
        }
    });
});

answered Nov 26 '14 at 11:19

S.Pols

3,414
2
21
42

Sorry but still nothing. Only improvement is taht script isn't adding another #extracontent elements when i check another radio and chceck #delivery_option_5_1 again but it's not removing that #extracontent when i check other radio input. – Jakub M Nov 26 '14 at 11:39
Do you only want to add the extra content div on `#delivery_option_5_1`? Also is the div `delivery_options` right after the `#delivery_option_5_1` checkbox? Can you maybe add the html to your question? – S.Pols Nov 26 '14 at 11:42

score 0 · Accepted Answer · answered Nov 27 '14 at 15:44

I did it like that.

$(document).ready(function () {
    $("#wpunkcie").change(function () {

        if ($(this).prop("checked")) {
            $("#wysylka").after("<p id='info'>Mapa i informacja o wysyłce</p>");
        }
    });
    $("#inne").change(function () {



        if ($(this).prop("checked")) {
            $("#info").remove();
        }
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="wysylka"><input type="radio" name="halo" id="wpunkcie"> Odbiór w punkcie pocztowym</input><br>
    <input type="radio" name="halo" id="inne">Inna forma wysyłki</input></form>

Thx for help. :)

jquery check for checked input

2 Answers2