Question

I have this form:

<form>
        <div class="box">
            <h1>Contact form :</h1>
            <label>
                <span>Typ: </span>
                <input type="radio" name="typ" value="admin" />admin<br />
                <input type="radio" name="typ" value="user" />user<br />
            </label>
            <label>
                <span>E-mail :</span>
                <input type="text" class="post" name="email" id="email"/>
            </label>
            <label>
                <span>Subject :</span>
                <input type="text" class="post" name="subject" id="subject"/>
            </label>

            <label>
                <span>If admin :</span>
                <input type="text" class="post" name="ifadmin" id="ifadmin"/>
            </label>

        </div>
    </form>

How to do something like that: if I choose the first radio “admin” is displayed dynamically with jquery the “ifadmin” and if I choose “user” is not displayed?

Answer 1

Give the id=’ifadmin’ to the <label> of ifadmin and put this code simply above the form or in the head.

 <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){

$("input:radio[name=typ]").click(function() {
    if($(this).val()=="admin")
    $("#ifadmin").css("display","none");
    else
    $("#ifadmin").css("display","block");
});




    });
    </script>