Delete record using angular

Question

PROBLEM

Hello! I want to delete record using angular. So that must look like that: I click button "X" (delete) and record must be deleted.

WHAT I GOT FOR NOW

I don't know if all is correct, but there is my code:

html

<div ng-repeat="lists in listsdata.lists">
                    <div id="DIV_24" close-on-outside-click="div.popup_information">
                        <button ng-click="lists.show = !lists.show" id="MORE_BUTTON">:</button>
                        <div class="popup_information" ng-show="lists.show">

                                <button id="DELETE_BUTTON" ng-click="del_list()">X</button>

                            <a href="">
                                <button id="EDIT_BUTTON">E</button>
                            </a>
                        </div>
                        <a href="#/{{lists.id}}">
                            <div id="DIV_25">
                                {{lists.name}}
                            </div>
                            <div id="DIV_26">
                            </div>
                    </div></a>
                </div>

angular

myApp.controller('listsController', ['$scope', '$log', '$http',
    function($scope, $log, $http){

        $http({
            method: 'GET',
            url: 'http://localhost/anydocopy/public/lists'
        })
            .success(function (d) {
                console.log(d);
                $scope.listsdata = d;
            });

        $scope.key = function($event){
            console.log($event.keyCode);
            if ($event.keyCode == 13) {
                var list = {
                    name: $scope.listname
                };
                $scope.listname = '';
                  $http({
                    method: 'POST',
                    url: 'http://localhost/anydocopy/public/lists',
                    data: list
                })
                    .success(function () {
                        console.log('true');
                        $http({
                            method: 'GET',
                            url: 'http://localhost/anydocopy/public/lists'
                        })
                            .success(function (d) {
                                console.log(d);
                                $scope.listsdata = d;
                            });
                    })
                    .error(function () {
                        console.log('false');
                    });
            }};

        $scope.del_list = function () {
            $http({
                method: 'DELETE',
                url: 'http://localhost/anydocopy/public/lists/'+ $scope.listsdata.lists.id
            });
            console.log($scope.listsdata.lists)
        }

      }]);

laravel controller

public function delete($id)
{
    $response['lists'] = Lists::findorfail($id)->delete();

    return Response($response, 201);
}

laravel route

Route::delete('lists/{id}', 'ListsController@delete');

So for now when I click button, I cant set right url in agular function, because I can't get that id from $scope.listsdata.. I can get all array, but how to get only id I want? So if I click on button what is on list with id=1 so in angular function must work like method=delete and url= url+id. How to do that, please help.

JB Nizet · Accepted Answer · 2015-09-19 09:01:03Z

2

Pass what you want to delete as argument. And rename lists to list, since it represents a single list:

<div ng-repeat="list in listsdata.lists">
    ...
    <button ng-click="del_list(list)">X</button>

and

$scope.del_list = function(listToDelete) {
    $http({
        method: 'DELETE',
        url: 'http://localhost/anydocopy/public/lists/'+ listToDelete.id
    });
}

answered Sep 19, 2015 at 9:01

JB Nizet

694k94 gold badges1.3k silver badges1.3k bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Rinalds Gudriks Over a year ago

Wow, that was so easy, thanks a lot.. I don't know why I tryed to screw things up, when it's a lot easier way. But yea, thanks a lot.

Kashif Mustafa · Accepted Answer · 2015-09-19 09:09:13Z

0

Pass argument in ng-click function you want to delete like

    <div ng-repeat="list in listsdata.lists">
    ...
    <button ng-click="del_list(list)">X</button>
</div>

you Delete function looks ike

    $scope.del_list = function(selectedItem) {
    $http({
        method: 'DELETE',
        url: 'http://localhost/anydocopy/public/lists/'+ selectedItem.id
    });
console.log($scope.listsdata.lists)
}

answered Sep 19, 2015 at 9:09

Kashif Mustafa

1,1826 silver badges20 bronze badges

Collectives™ on Stack Overflow

Delete record using angular

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related