Search code examples
jquery-mobilejquery-mobile-flipswitch

jquery mobile flipswitch active by default


I'm using query mobile 1.4.0 and I'm trying to make my flip switch active by default but I'm not really sure how to approach it. I've tried adding selected="selected" to the <input> but it doesn't seem to make a difference. Anyone have any ideas?

      <form>
      <div class="prof-wrap">
        <div class="prof-left">
          <div class="prof-txt-wrap">
            <div class="text-off">OFF TITLE</div>
            <div class="text-off2">OFF TYPE</div>
          </div>
        </div>
        <!-- END prof-left -->
        <div class="prof-mid">
          <div class="prof-switch">
            <input type="checkbox" data-role="flipswitch" name="flip-checkbox-4" id="flip-checkbox-4" data-wrapper-class="custom-size-flipswitch" selected="selected">
          </div>
          <!--END prof-mid --> 
        </div>
        <!-- END prof-switch -->
        <div class="prof-right">
          <div class="prof-txt-wrap2">
            <div class="text-active">ON TITLE</div>
            <div class="text-active2">ON TYPE</div>
          </div>
        </div>
        <!-- END prof-right --> 
      </div>
      <!-- END prof-wrap -->
      </form>

Solution

  • According to the Documentation use the checked=""attribute:

    <form>
        <label for="flip-checkbox-4">Flip toggle switch checkbox:</label>
        <input type="checkbox" data-role="flipswitch" name="flip-checkbox-4" id="flip-checkbox-4" checked="">
    </form>