0

I'm new to AngularJS.

I am facing issue with page get reloaded while remove image. For example, I uploaded 3 images. If I delete images stack order then working well. If I delete between any images then page getting reloaded.

template code

<div class="col-md-3 onboardup--image-container" ng-repeat="photo in pet.photos">
    <div class="img-div" style="background-image: url({{photo.photo_url}});"></div>
    <div class="btn-container">
        <button ng-click="removeImage(photo, $event)" class="btn btn-primary" ng-if="newPet == 'true'">
            Delete
        </button>
    </div>
</div>


$scope.removeImage = function(photo, $event){

    var target = $event.target;
    var container = $(target).parent().parent();
    container.remove();
    var index = $.inArray(photo, $scope.photoSrcList);
    $scope.photoSrcList.splice( index, 1);
    $scope.pet.photos.splice( index, 1);
};

Will be thankful for any kind of help.

Thiyagarajan Veluchamy
  • 515
  • 5
  • 13

1 Answers1

1

Could it be a duplicate of: AngularJS, clicking a button within a form causes page refresh

Try adding: type='button' to your <button>

Community
  • 1
  • 1
Oliver Nicolaas Ponder
  • 919
  • 9
  • 14