Delete row in AngularJS + NodeJS + Postgresql

why I can delete row in frontend but its not deleted in postgresql ? I've been copy-paste the code from other menu in my program but it not work. I've been try to search in google because I think my code is wrong but its SAME !

here is my angularJS controller

 $scope.getDataLoct = function(){
    PanelEditor.getDataLoct().then(function(result) {
        console.log('result loct',result);
        var res = result.data;
        console.log('resultdataloct', res);
            $scope.tampil= res; 
    }); 
}


   $scope.deleteVenues = function(dataD, idx){
    var dataD = $scope.tampil[idx];
    console.log('dataD',dataD);
    PanelEditor.deleteVenue(dataD).then(function(result){
        console.log('sukses');
        $scope.tampil.splice(idx, 1);       
    });
}

here is my angularJS HTML

   <div ng-model ="info"> 
      <table  class="ui celled padded table">
        <thead>
            <tr>
              <th>No</th>
              <th>Title</th>
              <th>Addres</th>
              <th>Latitude</th>
              <th>Longitude</th>
              <th>Action</th>
          </tr>
        </thead>
        <tbody class="content" ng-repeat="tmp in tampil track by $index">
            <tr>
              <td class="collapsing">
                <div class="ui ribbon label">{{$index +1}}</div>
              </td>
              <td >{{tmp.title}}</td>
              <td >{{tmp.address}}</td>
              <td >{{tmp.latitude}}</td>
              <td >{{tmp.longitude}}</td>
              <td><div class="ui small blue basic icon buttons right floated">
                  <button class="ui button" tooltips tooltip-content="Edit" tooltip-side="bottom" tooltip-speed="fast" tooltip-size="small" tooltip-hide-trigger="click mouseleave" ng-click="clickMenuVenue('loct','Edit Venue','',info)">
                    <i class="write icon"></i>
                  </button>
                  <button class="ui button" tooltips tooltip-content="delete" tooltip-side="bottom" tooltip-speed="fast" tooltip-size="small" tooltip-hide-trigger="click mouseleave" ng-click="deleteVenues($index)">
                    <i class="remove icon"></i>
                  </button>
                </div></td> 
            </tr>
        </tbody>
        </table>
    </div>

here is my angularJS service

  getDataLoct: function() {
    return $http.get('/venue/getAll/');
  },

   deleteVenue: function(dataD) {
    console.log('service',dataD);
    return $http.post('/venue/deleteVenue/',dataD);  
  }

here is my NodeJS Controller

 deleteVanue: function (req, res) {
        Vanue.destroy({id:req.param('id')}).exec(function (err){
          return res.json(200);
        });
    },
    getAll: function (req, res) {
        Venue.find().sort({ id: 'asc' }).exec(function (err, found){
            return res.json(200, found);
        });
    }

and when I clik Remove Button the Console printed this dataD undifinded

SOMEONE CAN HELP??!!

if my question have mistake please help me to fix it

Answers


In your delete function:

$scope.deleteVenues = function(dataD, idx) {..}

you have TWO parameters in your controller.

But in the view you only call it with one parameter:

ng-click="deleteVenues($index)"

There are two options:

Either you pass the whole object which is to be deleted or you pass the $index.

Right now your app wants to read idx in the controller, but you are passing only one parameter. That's the reason why you get this error.


Need Your Help

Bind function on key up in Angular

javascript jquery html angularjs angularjs-directive

I am a designer/front-end developer and have little to no experience with Angular, so I'm hoping to get some help here. I have the following html