从ASP.NET MVC项目上的Angular Datatable中捕获已选中的复选框

时间:2016-02-01 13:35:27

标签: javascript c# asp.net angularjs asp.net-mvc

我想在ASP.NET MVC项目的Angular Datatable上查看复选框。示例代码如下,不幸的是toggleAll和toggleOne函数不会使用$ scope对象触发。如何勾选复选框?像这样的样本:[http://l-lin.github.io/angular-datatables/#/rowSelect]

dataTableApp.js

var app = angular.module('segmentoperationBaseApp', ['datatables']);
app.controller('homeCtrl', ['$scope', '$http', 'DTOptionsBuilder', 'DTColumnBuilder',
    function ($scope, $http,DTOptionsBuilder, DTColumnBuilder) {
        var vm = this;
        vm.selected = {};
        vm.selectedAll = false;
        vm.toggleAll = toggleAll;
        vm.toggleOne = toggleOne;

        var titleHtml = '<input type="checkbox" ng-model="selectAll" ng-click="toggleAll(selectAll, selected)">';

        $scope.dtOptions = DTOptionsBuilder.newOptions().withOption('ajax', {
            url: "/home/getdata",
            type: "POST"
        })
        .withPaginationType('full_numbers')
        .withDisplayLength(10);

        $scope.dtColumns = [
            DTColumnBuilder.newColumn(null).withTitle(titleHtml).renderWith(function (data, type, full, meta) {
                vm.selected[full.id] = false;
                return '<input type="checkbox" ng-model="selected[' + data.segmentoperationid + ']" ng-click="toggleOne(selected)">';
            }),
            DTColumnBuilder.newColumn("segmentoperationid", "Segment Operation ID").notVisible(),
            DTColumnBuilder.newColumn("name", "New Name"),
            DTColumnBuilder.newColumn("createdon", "Createdon").notVisible()
        ];

        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]) {
                        vm.selectAll = false;
                        return;
                    }
                }
            }
            vm.selectAll = true;
        };
    }]) 

0 个答案:

没有答案