reset star rating after submit in angularjs - angularjs

Question

Hi I am using star rating option with form submit using angularjs like in the following jsfiddle
<http://jsfiddle.net/manishpatil/2fahpk7s/>
all are working fine.
But I want to reset star rating to default after submit form.
anyone can help me to achieve this?
please refer my code how I implement this star rating
HTML:
Controller:
function socialPostCtrl(socialPostService, userPersistenceService, $location, $sce) {
var socialPostVM = this;
socialPostVM.maxRating = 5;
socialPostVM.clickstar = function (param) {
socialPostVM.rating = param ;
};
//submit post function
socialPostVM.addpost = function () {
angular.element(document.getElementById('addPostBtn'))[0].disabled = true;
var result = socialPostService.addpost(socialPostVM.loggedUserDetails.UserId, socialPostVM.takeawayGuid, socialPostVM.newpost, socialPostVM.attachment, socialPostVM.rating).then(function (response) {
if (response.Success) {
var newpost = {};
newpost.postid = response.SocialPost.SocialPostId;
newpost.postGuid = response.SocialPost.SocialPostGuid;
newpost.profilepic = "";
newpost.postby = response.SocialPost.PostUser;
newpost.postbyid = response.SocialPost.UserId;
newpost.poston = response.SocialPost.PostDate;
newpost.posttext = response.SocialPost.PostContent;
newpost.hasliked = response.SocialPost.HasLiked
newpost.totallikes = 0;
newpost.comments = [];
newpost.totalcomments = 0;
newpost.showcommentbox = false;
newpost.candeletepost = function () { return true; }
newpost.hasAttachment = response.SocialPost.HaveMedia;
if (response.SocialPost.HaveMedia) {
newpost.postattachment = $sce.trustAsResourceUrl(response.SocialPost.PostMedia.MediaFileName);
}
newpost.rating = socialPostVM.rating / socialPostVM.maxRating * 100;
socialPostVM.socialposts.splice(0, 0, newpost);
}
}).finally(function () {
socialPostVM.attachment = [];
angular.element(document.getElementById('addPostBtn'))[0].disabled = false;
angular.element(document.getElementById('posttext'))[0].value = "";
socialPostVM.filelist = [];
});
};
Directive:
angular.module("test").directive('starRating', function () {
return {
restrict: 'E',
scope: {
rating: '=',
maxRating: '#',
readOnly: '#',
click: "&"
},
template: "<div style='display: inline-block; margin: 0px; padding: 0px; cursor:pointer;' ng-repeat='idx in maxRatings track by $index'> \
<img ng-src='{{((hoverValue + _rating) <= $index) && \"/images/star-empty-lg.png\" || \"/images/star-fill-lg.png\"}}' \
ng-Click='isolatedClick($index + 1)' \
ng-mouseenter='isolatedMouseHover($index + 1)' \
ng-mouseleave='isolatedMouseLeave($index + 1)'></img> \
</div>",
compile: function (element, attrs) {
if (!attrs.maxRating || (Number(attrs.maxRating) <= 0)) {
attrs.maxRating = '5';
};
},
controller: function ($scope, $element, $attrs) {
$scope.maxRatings = [];
for (var i = 1; i <= $scope.maxRating; i++) {
$scope.maxRatings.push({});
};
$scope._rating = $scope.rating;
$scope.isolatedClick = function (param) {
if ($scope.readOnly == 'true') return;
$scope.rating = $scope._rating = param;
$scope.click({
param: param
});
};
}
}
});
Thanks

Answer 1

you need more info here.
on the function you call for submit you will need to reset the value to their default.
$scope.submit = function(data){
//do something with data
//reset values back to defualt
$scope.starRating1 = 4;
$scope.starRating2 = 5;
$scope.starRating3 = 2;
$scope.hoverRating1 = $scope.hoverRating2 = $scope.hoverRating3 = 0;
};