How to use Bootstrap Switch with Lightning Components

Question

I'm trying to use bootstrap switch to control a checkbox on my input form but it is not carrying the value over. Do I need to get the value from the switch somehow?

COMPONENT

         <aura:attribute name="newIdea" type="Idea"
                default="{ 'sobjectType': 'Idea',
                         'Title': '',
                         'Body': '',
                         'Merchants__Anonymous__c':'false',
                         'CommunityId': '09ao0000000a8tqAAA'
                         }"/>
<input type="checkbox" value="!v.newIdea.Merchants__Anonymous__c}" data-label-text="Anonymous" data-on-color="danger"/>
<a id="postButton" href="#" onclick="{!c.postIdea}" class="linkstandard red">Post</a>

CONTROLLER

postIdea : function(component, event, helper)
{
    var newIdea = component.get("v.newIdea");
    helper.createIdea(component, newIdea);  
}

HELPER

createIdea: function(component, newIdea) {
  this.upsertIdea(component, newIdea, function(a) {
      var ideas = component.get("v.ideas");
      ideas.push(a.getReturnValue());
      component.set("v.ideas", ideas);      

      var self = this;
      self.makeIsotope(component);
      $j('#newidea').modal('hide');

  });
}

APEX

    @AuraEnabled
public static Idea createIdea(Idea newIdea)
{upsert newIdea;}

Answer 1

A couple of contributing issues.

• looks like you are missing a curly brace in your value= expression:

• raw input elements do not have built in bidirectional data binding (just unidirectional) and things should work fine if you switch to using ui:inputCheckbox instead (see http://www.salesforce.com/us/developer/docs/lightning/index_Left.htm#CSHID=ui_checkbox.htm|StartTopic=Content%2Fui_checkbox.htm|SkinName=webhelp)