Checkbox update label content onload and onchange

214 views
Skip to first unread message

Pelayo Maojo

unread,
Aug 5, 2015, 8:13:44 AM8/5/15
to Semantic UI
Hi, 

I have this fiddle http://jsfiddle.net/Lnnnhsoh/ where the text on the label is updated on state change of Checkbox.

My goal is to make the text update when the page is loaded, not only when the checkbox is clicked.

Ho to get that

HTML:

<form><div class="field">
    <div class="ui  toggle checkbox activado">
        <input class="etiqueta" type="checkbox" id="confirm" name="confirmed">
        <label>...</label>
    </div>
   </div>
</form>
<form><div class="field">
    <div class="ui toggle checkbox activado">
        <input type="checkbox" id="confirm" name="confirmed" checked="">
        <label>...</label>
    </div>
   </div>
</form>
<form><div class="field">
    <div class="ui checked toggle checkbox activado">
        <input type="checkbox" id="confirm" name="confirmed" checked="">
        <label>...</label>
    </div>

JAVASCRIPT:

$(".activado").checkbox('setting', 'onChange', function () {
    if ($(this).is(':checked')) {
    $(this).siblings('label').html('Activado');
  } else {
    $(this).siblings('label').html('Desactivado');
  }
});
$('.checked label').html('Activado');



Reply all
Reply to author
Forward
0 new messages