I have a radio group which is coming dynamically to my page. I was able to successfully disable any radio using php, but I want to add css property of text-decoration: line through on the disabled radio label. This is the code :
<div class="form-item form-type-radio form-item-example-pane-time-slot-1">
<input type="radio" id="edit-example-pane-time-slot-1-11" name="example_pane[time_slot_1]" value="11" class="form-radio">
<label class="option" for="edit-example-pane-time-slot-1-11">11 - 12 pm </label>
</div>
How is it possible using jquery ? My jquery code is this :
if ($('#edit-example-pane-time-slot-1-11').attr('disabled',true))
{
$(this).css('text-decoration', 'line-through');
}
and its not working.
You can do this with just css
.form-radio:disabled + .option {
text-decoration: line-through;
}
You should be checking
if ($('#edit-example-pane-time-slot-1-11').attr('disabled')===true))
{$(this).siblings('label').css('text-decoration', 'line-through');}
Or to just disable it, you should use .attr('disabled','disabled')
. Seems you mixed these two.
PS: Please read difference between == and === in JavaScript.
Here's the code to add css for it.
$(this).siblings('label').css('text-decoration','line-through');