CODEWITHSUNDEEP
javascriptphpjqueryhtmlforms
NewbieDeveloper
NewbieDeveloper

Reputation: 126

How to make a button disable/enable on click?

I have html which is something like, not exactly like this, but just to give you an idea.

    <input type="text" disabled="disabled" name="ip" />
    <input type="text" name="name" />
    <input type="text" name="email" />
    <input type="submit" value="send" />

the IP field is disabled, I want to put a button right next to it, which will enable the field without refreshing the page.

Can you please help me do this?

Thanks in advance

Upvotes: 0

Views: 230

Answers (7)

Academia
Academia

Reputation: 4124

Check this javascript for a working example and a possible solution using javascript.

Check this jQuery 1.6+ using jQuery 1.6+. If you want to use jQuery 1.5-, just change prop by attr.

Hope it useful!

Upvotes: 1

Suchit kumar
Suchit kumar

Reputation: 11859

you can try this:

 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
 <script>
function enable(){
    $('#ip').prop("disabled",false);
}
 </script>
 <input type="text" disabled="disabled" name="ip" id="ip" />
 <input type="button"  value="Refresh" onclick="enable();">

Upvotes: 1

Pk boss
Pk boss

Reputation: 264

<input type="text" disabled="disabled" name="ip" id='ip' />
<input type="button" name="control" id="control" />
<input type="text" name="name" />
<input type="text" name="email" />
<input type="submit" value="send" />

Now put jquery code at end of file 

 $( "#control" ).click(function() {
    $('#ip').toggleDisabled();
 });

Upvotes: 2

fanfan1609
fanfan1609

Reputation: 179

You can use attr("disabled",false) to remove disabled attribute

Demo

Upvotes: 1

Mani
Mani

Reputation: 888

try this one:

    <input type="text" disabled="disabled" name="ip" id="ip" />
    <input type="button"  value="Refresh" onclick="$('#ip').attr('disabled',false);">
    <input type="text" name="name" />
    <input type="text" name="email" />
    <input type="submit" value="send" />

Upvotes: 1

Viswanath Donthi
Viswanath Donthi

Reputation: 1821

Consider your buttons as shown below:

<input type="text" disabled="disabled" name="ip" /> <input type="button" id="myButton" />

Now, on clicking button right next to it you have to remove the disabled attribute of ip button in jquery as:

$("#myButton").click(function(){
    $("input[name='ip']").removeAttr('disabled');
});

That's it..!!

Upvotes: 1

4b0
4b0

Reputation: 22323

Give ID for your textbox.

<input type="text" disabled="disabled" name="ip" id="YourID"/>

And in jquery :

$(document).ready(function(){
    $('#YourButtonID').click(function(){
    if($('#YourID').prop('disabled'))
         $('#YourID').prop('disabled', false)
    else
         $('#YourID').prop('disabled', true)
         //Do nothing if not required.  

    });
})

Upvotes: 1

Related Questions