CODEWITHSUNDEEP
javascriptjqueryhtml
Immo
Immo

Reputation: 601

Disable all elements in a form if clicking a radio button

I would like to disable all form elements in a div and show a RED message inside a new div if I click a radio button outside the div.

For example:

<div id="myform">
  <form>
    First name: <input type="text" name="firstname" /><br />
    Last name: <input type="text" name="lastname" />
  </form>
</div>
<div id="message">
  Red Message here
</div>


<form>
  <input type="radio" name="sex" value="male" /> Male<br />
  <input type="radio" name="sex" value="female" /> Female
</form>

I want when someone clicks one of the two radio buttons to disable all elements in the above form (myform) and display a red message in div message.

Thanks

Upvotes: 0

Views: 1607

Answers (3)

SeanCannon
SeanCannon

Reputation: 77966

$('input[name="sex"]').click(function(){
    $('#myform input').prop('disabled',true);
    $('#message').fadeIn();
});
$('#reset').click(function(){
    $('#myform input').removeProp('disabled');
    $('#message').fadeOut();
});

Working demo: http://jsfiddle.net/AlienWebguy/2zr4J/2/

Upvotes: 0

Jacek Kaniuk
Jacek Kaniuk

Reputation: 5229

$('input[name="sex"]').click(function(){
    $('#myform input').prop('disabled',true);
    $('#message').show();
});

#message { display:none; color:red }


$('#reset').click(function(){
    $('#myform input').prop('disabled',false);
    $('#message').hide();
});

http://jsfiddle.net/2zr4J/1/

Upvotes: 0

ShankarSangoli
ShankarSangoli

Reputation: 69905

Try this

$("input:radio").click(function(){
   $("#myform input").attr("disabled", true);
   $("#message").show();
});

Upvotes: 2

Related Questions