CODEWITHSUNDEEP
jquery
user1050619
user1050619

Reputation: 20856

displaying text box dynamically jQuery

I'm a newbie to jQuery and I would like to display a text box below if the user selects "Other". How will I select the individual item in the radio box?

Also, when the user un-clicks the OTHER button then the textbox should be removed.

<html>

    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">

        </script>
        <script>
            $(document).ready(function() {
                $("$select-car").click(function() {

                });
            });
        </script>
    </head>

    <body>
        <div id="select-car">
            <input type="radio" name="car" value="Toyota">GM<br>
            <input type="radio" name="car" value="Honda">Ford<br>
            <input type="radio" name="car" value="Other" onlick>Other<br>
        </div>
    </body>

</html>

Upvotes: 0

Views: 200

Answers (2)

Mahmood Rehman
Mahmood Rehman

Reputation: 4331

ok than add textbox below your html like this :

<input style="display:none;" type="text" name="mytext" id="mytext"/>

write jQuery like this

$("input[type='radio']").change(function () {
    if ($(this).val() == "Other") {
        $("#mytext").show();
    } else {
        $("#mytext").hide();
    }
});

Upvotes: 0

Tushar Gupta - curioustushar
Tushar Gupta - curioustushar

Reputation: 57105

$("#select-car input[type='radio'][name='car']").change(function () {
    if (this.value === 'Other') {
        //show textbox $('#txt').show();
    }
    else{
        //hide textbox $('#txt').hide();
    }
});

References

.change()

multiple attribute selector

this keyword

Upvotes: 3

Related Questions