从angular-ui-grid更新数据库

时间:2018-01-02 19:30:03

标签: angularjs node.js database postgresql angular-ui-grid

当用户点击我的角度ui-grid中的删除按钮时,我正在尝试更改数据库中的一行。单击该按钮时,应该从网格中删除该行,并且应该使用值更新数据库中的表,以便该行不再出现在网格中,但它仍将在数据库中(软件 - 删除)。我的表名为申请人,包含行ID,名字,姓氏,电子邮件,职位,简历和删除。 Deleted是一个默认为false的布尔列,如果为true,则该行不应出现在我的ui-grid中。我已完成此部分,但是当在网格上按下按钮时,我无法获取更新数据库中已删除列的代码。这是网格的控制器(从数据库中获取申请人):

angular.module('myApp')
.controller('gridController',['$scope','$http','$log',function ($scope, $http,$log){

    $scope.deleteRow = function(row) {
        var index = $scope.gridOptions.data.indexOf(row.entity);
        $scope.gridOptions.data.splice(index, 1);


        $http({
            method:'POST',
            url:'/directives/updateApplicant'
        })
    }

    $scope.gridOptions = {
        enableFiltering:true,
        columnDefs: [
            {name: 'id', field:'id'},
            {name:'firstName',field:'firstName'},
            {name:'lastName',field:'lastName'},
            {name:'email',field:'email'},
            {name:'position',field:'position'},
            {name:'resume', field:'resumeFileName', cellTemplate:'<div class="ui-grid-cell-contents"><a href="/directives/resume/{{COL_FIELD}}" target="_self">{{ COL_FIELD }}</a></div>'},
            {name:'delete',cellTemplate: '<button class="btn primary" ng-click="grid.appScope.deleteRow(row)">Delete</button>', enableFiltering:false}
        ]
    }

    $scope.data = []
    $http({
        method:'GET',
        url:'/directives/applicants'
    }).then(function(success){
        $scope.gridOptions.data = success.data;
    },function(reason){
        $scope.error = reason.data;
        $log.info(reason);
    })
}])

当它到达后期路线时,此代码运行:

module.exports.updateApplicant = function(req,res){
    applicant.forge({id: '31'})
    .fetch({require:true})
    .then(function(applicant){
        applicant.save({
            deleted:'true'
        })

    .then(function(){
        res.json({error:false,data:{message:'applicant details updated'}})
    })
    .catch(function(err){
        res.status(500).json({error:true, data:{message: err.message}})
    });
    })
    .catch(function(err){
        res.status(500).json({error:true,data:{message:err.message}})
    })
}

这个工作得很好唯一的问题是我有ID硬编码。有没有办法可以将ID从网格中选定的行传递给这个变量?

1 个答案:

答案 0 :(得分:0)

单击按钮

时发送http请求
    $scope.deleteRow = function(row) {
      var index = $scope.gridOptions.data.indexOf(row.entity);
      $scope.gridOptions.data.splice(index, 1);


      $http({
        method:'POST',
        url:'/directives/updateApplicant',
        data: $scope.gridOptions.data[index],
        headers: {'Content-Type': 'application/x-www-form-urlencoded'}
      }).success(function (data, status, headers, config) {
            console.log("success");
      }).error(function (data, status, headers, config) {
           console.log(status);
      })
  }

您需要安装body-parser并将其用作中间件(app.use(bodyParser.urlencoded({ extended: false }))来获取POST正文。

module.exports.updateApplicant = function(req,res){

    var bid = req.body.id;         

    applicant.forge({id: bid})
    .fetch({require:true})
    .then(function(applicant){
        applicant.save({
            deleted:'true'
        })

    .then(function(){
        res.json({error:false,data:{message:'applicant details updated'}})
    })
    .catch(function(err){
        res.status(500).json({error:true, data:{message: err.message}})
    });
    })
    .catch(function(err){
        res.status(500).json({error:true,data:{message:err.message}})
    })
}