CODEWITHSUNDEEP
csstwitter-bootstrap
user2873816
user2873816

Reputation: 179

How to create bootstrap switch

One of my web designer given template for making bootstrap switch.I compiled it and rendered on top of page.it's displaying checkbox.

template Code:

 <script id="switchTemp" type="text/x-handlebars-template">
    <div class="span16 mr1 headerToggleDiv" style="height:42px;">
    <div class="switch switch-square pull-right" data-off-label="1" data-on-label="2"><input type="checkbox" id="switchBox"/></div>
    </div> 
</script>

using this, I tried in the following way.

  $('#switchBox').wrap('<div class="switch switch-square pull-right has-switch" />').parent().bootstrapSwitch();

getting small with default names(on,off),like in the following way.

enter image description here

I want in the following way.

enter image description here

I want 1,2 instead of on,off as a labels.

can anyone help me.

Thanks

Upvotes: 0

Views: 1774

Answers (2)

Vahid Taghizadeh
Vahid Taghizadeh

Reputation: 997

You can use this plugin for your work:

http://www.bootstrap-switch.org/

Upvotes: 0

Unknown User
Unknown User

Reputation: 3668

Please remove the script tag and use the below code to get 1 and 2 for On and Off.

 <div class="make-switch pull-right" data-on-label="1" data-off-label="2">
    <input type="checkbox" id="switchBox"/>
 </div>

Upvotes: 2

Related Questions