Я использую Angular JS Datatable для получения данных - PullRequest
Новая
       29

Я использую Angular JS Datatable для получения данных

0 голосов
/ 19 сентября 2019 
    .controller('incidentListCtrl', [
    '$scope', '$filter', '$http', '$log', 'appConfig' ,'$stateParams', 'DTColumnDefBuilder', 'DTColumnBuilder', 'DTOptionsBuilder', 'statusIcon', 'priorityIcon', 'HorizontalScrolling', 'ajaxErrorHandler',
    function ($scope, $filter, $http, $log, appConfig, $stateParams, DTColumnDefBuilder, DTColumnBuilder, DTOptionsBuilder, statusIcon, priorityIcon, HorizontalScrolling, ajaxErrorHandler) {
    $scope.incidentStatus = $stateParams.incidentStatus;
    $scope.dtOptions = DTOptionsBuilder.newOptions().withOption('order', [1, 'asc']);
    $scope.dtColumnDefs = [DTColumnDefBuilder.newColumnDef(0).notSortable()];
    $scope.backStatus =1;

    $scope.dtOptions = DTOptionsBuilder.newOptions()
        .withOption('ajax', {
            dataType: 'json',
            contentType: "application/json; charset=utf-8",
            url: appConfig.apiUrl + "/exceptions/incidents/dt?status=" + $scope.incidentStatus,
            xhrFields: {withCredentials: true},
            type: 'POST',
            data: function(data) {
                return JSON.stringify(data);
            },
            error: function (response) {
                ajaxErrorHandler.handle(response);
            }
        })
        .withDataProp('data')
        .withOption('processing', true)
        .withOption('serverSide', true)
        .withLightColumnFilter({
            '1' : {type : 'text'},
            '2' : {type : 'text'},
            '3' : {type : 'date'},
            '5' : {
                type : 'select',
                values: [{
                    value: 'LOW', label: 'LOW'
                }, {
                    value: 'MEDIUM', label: 'MEDIUM'
                }, {
                    value: 'HIGH', label: 'HIGH'
                }]
            },
            '6' : {type : 'text'},
        })
        .withOption('drawCallback', function (settings) {
            HorizontalScrolling.addToDataTable(0);
        });

    $scope.dtColumns = [
        DTColumnBuilder.newColumn('id').withTitle('Incident ID').renderWith(function(data, type, full) {
            return 'INC-' + data;
        }),
        DTColumnBuilder.newColumn('exception.exceptionDefinitionRun.name').withTitle('Exception Name').withClass('non-expandable-cell'),
        DTColumnBuilder.newColumn('assignee.name').withTitle('Current Assignee').withClass('non-expandable-cell'),
        DTColumnBuilder.newColumn('creationTimestamp').withTitle('Created Date').renderWith(function(data, type, full) {
            return $filter('date')(Date.parse(data),'yyyy-MM-dd');
        }),
        DTColumnBuilder.newColumn('dueDate').withTitle('Due Date').renderWith(function(data, type, full) {
            return $filter('date')(Date.parse(data),'yyyy-MM-dd');
        }),
        DTColumnBuilder.newColumn('exception.exceptionDefinitionRun.priority').withTitle('Risk').renderWith(function(data, type, full) {
            return '<span><i class="' + priorityIcon.get(data) + '"></i> ' + data + '</span>';
        }).withClass('non-expandable-cell'),
        DTColumnBuilder.newColumn('incidentResolution.incidentCause.name').withTitle('Root Cause').renderWith(function(data, type, full) {
            if(data==null) {
                return 'N/A';
            }else {
                return data;
            }
        }).withClass('non-expandable-cell'),
        DTColumnBuilder.newColumn('status').withTitle('Status').renderWith(function(data, type, full) {
            return '<span><i class="' + statusIcon.get(data) + '"></i> ' + data + '</span>';
        }).withClass('non-expandable-cell'),
        DTColumnBuilder.newColumn('id').withTitle('Action').renderWith(function(data, type, full) {
            return  '<div class="btn-group-xs">' +
                    '  <a href="#!/app/incident-view/' + full.exception.id + '/' + data + '/'+$scope.incidentStatus+'/' + $scope.backStatus +'" class="btn btn-flat btn-xs btn-success" target="_blank" data-toggle="tooltip" data-placement="bottom" title="View" tooltip>' +
                    '     <i class="ion ion-eye"></i>' +
                    '  </a>' +
                    '</div>';
        }).withClass('text-center').notSortable().withOption('searchable', false)
    ];
}]);

Я использую вышеуказанную функцию для получения данных.В настоящее время мне нужно добавить флажок для каждой строки.после того, как мне нужно выбрать строку и удалить ее.Можете ли вы помочь мне сделать эту задачу.

это HTML-код, который используется. 

<table width="100%" id="incidents-table" datatable="" dt-options="dtOptions" dt-columns="dtColumns" class="table table-bordered table-hover">
                </table>

Мне нужно сделать это, используя приведенный выше код.Я использую ниже угловой JS DataGable плагин.https://l -lin.github.io / angular-datatables / archives / #! / Welcome

Я попытался сделать это, следуя документации по подключению.но это не сработало для меня.Мне нужно сделать это, используя вышеуказанный код JS.

...