How can I Toggle a Selectbox between Enable and Disable onClick button...
Scenario: If I click on #locked div, this div should toggle with another class "icon-unclocked" and selectbox should be enabled. If I click on "#locked" again, selectbox should be disabled and "icon-unclocked" has to be removed.
First part (toggleClass) is working great.. but having problem in enable / disable selectbox...
Please check the code below...
HTML:
<div class="icon-locked" id="locked"> </div>
<select class="form-control" id="signontype" disabled>
<option>Option 01</option>
<option>Option 02</option>
</select>
jQuery:
$(document).ready(function(){
$( "#locked" ).click(function() {
$( this ).toggleClass( "icon-unlocked" );
$('select#signontype').prop('disabled', false);
});
});
You just need to check if your locked div contains pulse-icon-unlocked class with .hasClass()
$( "#locked" ).click(function() {
$( this ).toggleClass( "pulse-icon-unlocked" );
$('select#signontype').prop('disabled', !$(this).hasClass("pulse-icon-unlocked"));
});
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments