Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/429.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何使用angularjs和datatables单击按钮删除多行?_Javascript_Jquery_Angularjs - Fatal编程技术网

Javascript 如何使用angularjs和datatables单击按钮删除多行?

Javascript 如何使用angularjs和datatables单击按钮删除多行?,javascript,jquery,angularjs,Javascript,Jquery,Angularjs,我使用的是Angularjs plus数据表。我正试图通过复选框删除该行或多行。每当我选中复选框时,都需要复选框id的状态,即在所选数组中。它类似于{“1”:true,“2”:false}true意味着id被选中。我被代码卡住了 (function(angular) { 'use strict'; var app=angular.module('vehicle',['datatables','datatables.select','datatables.tabletools','

我使用的是Angularjs plus数据表。我正试图通过复选框删除该行或多行。每当我选中复选框时,都需要复选框id的状态,即在所选数组中。它类似于{“1”:true,“2”:false}true意味着id被选中。我被代码卡住了

(function(angular) {
    'use strict';
    var app=angular.module('vehicle',['datatables','datatables.select','datatables.tabletools','ngResource','ui','ui.sortable','datatables.buttons']); 
    app.controller('dataCtrl',Vehicledata);
    function Vehicledata($compile,$scope,$resource,DTOptionsBuilder,DTColumnBuilder){
         $scope.selected = {};
         $scope.selectedItems="";
         $scope.selectAll = false;
         $scope.toggleAll = toggleAll;
         $scope.toggleOne = toggleOne;
        var titleHtml = '<input ng-model="selectAll" ng-click="toggleAll(selectAll,selected)" type="checkbox">';
        $scope.sortableOptions = {
                                  'ui-floating': true
                                };
        $scope.dtOptions = DTOptionsBuilder.fromFnPromise(function() {
                            return $resource('data.json').query().$promise;
                            })
                            .withOption('createdRow', function(row, data, dataIndex) {

                                $compile(angular.element(row).contents())($scope);
                            })
                            .withOption('headerCallback', function(header) {
                                if (!$scope.headerCompiled) {

                                    $scope.headerCompiled = true;
                                    $compile(angular.element(header).contents())($scope);
                                }
                            })

                            .withTableTools('<?php echo $base_url;?>assets/swf/copy_csv_xls_pdf.swf')

                            .withTableToolsButtons([

                                'print', {
                                    'sExtends': 'collection',
                                    'sButtonText': 'Save',
                                    'aButtons': ['csv', 'xls', 'pdf']
                                }
                                ])
                                .withPaginationType('full_numbers')
                                .withButtons([
                                    {
                                        text: 'Deactivate',
                                        key: '1',
                                        action: function (e, dt, node, config) {
                                            //alert(JSON.stringify($scope.selected));
                                            for(var id in $scope.selected){
                                                alert($scope.selected.hasOwnProperty(id));
                                            }
                                        }
                                    },
                                    {
                                        text: 'Activate',
                                        key: '2',
                                        action: function (e, dt, node, config) {
                                            for(var id in $scope.selected){
                                                alert($scope.selected.hasOwnProperty(id));
                                            }
                                        }
                                    },
                                    {
                                        text: 'Delete',
                                        key: '3',
                                        action: function (e, dt, node, config) {
                                            for(var id in $scope.selected){
                                                alert($scope.selected.hasOwnProperty(id));
                                            }
                                        }
                                    }
                                ]);


        $scope.dtColumns = [
            //DTColumnBuilder.newColumn(null).withTitle('')
                //.notSortable()
                // Need to define the mRender function, otherwise we get a [Object Object]
                //.renderWith(checkboxHtml),
            DTColumnBuilder.newColumn(null).withTitle(titleHtml)
            .notSortable()
            .renderWith(function(data,type, full, meta) {
                 $scope.selected[full.Vehicle_id] = false;
                return '<input ng-model="selected[' + data.Vehicle_id + ']" ng-click="toggleOne(selected)" type="checkbox">';
            }),
            DTColumnBuilder.newColumn('Vehicle_id').withTitle('ID').notVisible(),
            DTColumnBuilder.newColumn('Vehicle_name').withTitle('Vehicle Name'),
            DTColumnBuilder.newColumn(null).withTitle('Vehicle Image')
                .notSortable()
                .renderWith(imageHtml),
            DTColumnBuilder.newColumn('Vehicle_passanger').withTitle('Max Passengers'),
            DTColumnBuilder.newColumn('Vehicle_Luggage').withTitle('Max Luggage'),
            DTColumnBuilder.newColumn('Agency_name').withTitle('Company'),
            DTColumnBuilder.newColumn(null).withTitle('Status').renderWith(showStatus)
        ];
    }
    function imageHtml(data,type, full, meta) {
    return '<img src='+data.Vehicle_image+' height=50 width=50>';
    }
    function checkboxHtml(data,type, full, meta) {

    return '<input type="checkbox" value='+data.Vehicle_id+' class="vehical_id" name="vehical_id[]">';
    }
    function showStatus(data,type, full, meta){
        if(data.Vehicle_status==1){
            return "active";
        }else{
            return "inactive";
        }
    }
    function toggleAll (selectAll,selectedItems) {
    for (var id in selectedItems) {
        if (selectedItems.hasOwnProperty(id)) {
            selectedItems[id] = selectAll;
            }
        }
    }
    function toggleOne (selectedItems) {
        for (var id in selectedItems) {
            if (selectedItems.hasOwnProperty(id)) {
                if(!selectedItems[id]) {
                    $scope.selectAll = false;
                    return;
                }
            }
        }
        $scope.selectAll = true;
    }
    })(angular);

感谢代码,但是。。。。。到底发生了什么事/你被困在哪里?请改为更新问题。当我单击“停用”按钮时,我需要状态为true的选定元素数组并将其删除。但我得到了真实身份的所有价值。您可以通过取消注释此//警报(JSON.stringify($scope.selected))进行检查;
[{"Vehicle_id":"1","Vehicle_name":"Sedan","Vehicle_company_id":"1","Vehicle_passanger":"5","Vehicle_Luggage":"5","Vehicle_image":"Photo.jpg","Vehicle_status":"1","Vehicle_sorting_ord":"1","Created":"2017-04-05 15:01:31","Agency_Id":"1","Agency_name":"Webtechstairs","Agency_Adress":"Mohali","Agency_Phonenumer":"0172456789","Agency_Email":"help.webtechstairs@gmail.com","Agency_Firstname":"Amit","Agency_Last_name":"Kumar","Agency_Status":"1","Agency_Created":"2016-09-22 11:58:36","Agency_Company_logo":"","Agency_Website":"www.webtechstairs.com","Agency_Packageid":"1","Agency_Tan_number":"BLQPK2240E"},{"Vehicle_id":"2","Vehicle_name":"SUV","Vehicle_company_id":"1","Vehicle_passanger":"7","Vehicle_Luggage":"7","Vehicle_image":"Jellyfish.jpg","Vehicle_status":"0","Vehicle_sorting_ord":"2","Created":"2017-04-04 16:31:02","Agency_Id":"1","Agency_name":"Webtechstairs","Agency_Adress":"Mohali","Agency_Phonenumer":"0172456789","Agency_Email":"help.webtechstairs@gmail.com","Agency_Firstname":"Amit","Agency_Last_name":"Kumar","Agency_Status":"1","Agency_Created":"2016-09-22 11:58:36","Agency_Company_logo":"","Agency_Website":"www.webtechstairs.com","Agency_Packageid":"1","Agency_Tan_number":"BLQPK2240E"}]