Input Rating Lightning Component
<aura:component > | |
<ltng:require scripts="/resource/rating/vendor/jquery.js,/resource/rating/lib/jquery.raty.js" | |
styles="/resource/rating/lib/jquery.raty.css" | |
afterScriptsLoaded="{!c.afterScriptsLoaded}"/> | |
<aura:attribute name="value" type="Integer" required="true"/> | |
<aura:attribute name="ready" type="Boolean" default="false"/> | |
<div aura:id="rating"></div> | |
</aura:component> |
({ | |
afterScriptsLoaded : function(component, event, helper) { | |
component.set("v.ready", true); | |
helper.createRating(component); | |
} | |
}) |
({ | |
createRating : function(component) { | |
// check in case coming from afterRender, | |
// before scripts are loaded | |
var ready = component.get("v.ready"); | |
if (ready === false) { | |
return; | |
} | |
var ratingElem = component.find("rating").getElement(); | |
$(ratingElem).raty({ | |
starType: "i", | |
score: component.get("v.value"), | |
click: function(score, evt) { | |
component.set("v.value", score); | |
} | |
}); | |
} | |
}) |
({ | |
afterRender: function(component, helper) { | |
this.superAfterRender(component, helper); | |
helper.createRating(component); | |
} | |
}) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment