Angular ui-grid Сохранение ширины столбцов в виде файлов cookie

Я здесь новичок, и мой английский не очень хорошо. Я использую ui-grid с angular. Моя проблема в том, что мне нужно сохранить ширину столбцов как cookie, но я не знаю, как $ смотреть эти параметры; / ширина чтения из массива работает, но хочу зарегистрироваться, когда пользователь меняет ширину. мой код:

 $scope.gridLicences = {
            headerRowHeight: 65,
rowSelection: true, enableColumnResizing: true, rowHeight: 31, showGridFooter: true, onRegisterApi: function(gridApi){

}, columnDefs: [ { name: 'Program.ProgramLine', displayName: "Linia", width: $scope.columnWidthTable[0], cellTemplate: '<div class="ui-grid-cell-contents " title="TOOLTIP" >{{grid.getCellValue(row, col)}}</div>' }, { name: 'Program.ProgramVersion', witdh: $scope.columnWidthTable[1], cellTemplate: '<div class="ui-grid-cell-contents " title="TOOLTIP" >{{grid.getCellValue(row, col)}}</div>' } ], data:'licences' }; //watching changes - empty now $scope.$watchCollection('columnWidthTable', function (newValues, oldValues) { if (newValues == oldValues) { return; } else { } });</pre>

person Mariusz Ślipko    schedule 06.11.2015    source источник
comment
Я не понимаю вашей проблемы, вам нужен способ записи информации в файлы cookie или вам нужно найти способ перехватить изменение пользователем ширины столбцов?   -  person imbalind    schedule 07.11.2015
comment
вам нужно найти способ перехватить изменение пользователем ширины столбцов, которые мне нужны.   -  person Mariusz Ślipko    schedule 09.11.2015


Ответы (1)


Итак, я нашел решение, вот мой код:

   function readCookie(index) {
        if ($cookies.columns != undefined || $cookies.columns != null) {
            var obj = JSON.parse($cookies.columns);
            return getValueByKey(obj,index);
        }
        return undefined;

    };

    function readCookies() {
        if ($cookies.columns != undefined || $cookies.columns != null) {
            var obj = JSON.parse($cookies.columns);
            $scope.columnWidthTable = obj;
        }
    }
     function saveCookie(index, value) {
        var obj = [];
        if ($cookies.columns != undefined || $cookies.columns != null) {
            obj = JSON.parse($cookies.columns);
        }
        var param = getValueByKey(obj,index);
        if(param != null || param != undefined )
        {
            setValueByKey(obj, index, value);
        }
        else
            obj.push({key:index,val:value});                        
        $cookies.columns = JSON.stringify(obj);
     }


     $scope.columnWidthTable = [];
     readCookies();
     $scope.gridOptions = {};


    $scope.gridOptions = {
        enableFiltering: true,
        headerRowHeight: 65,            
        rowSelection: true,
        enableColumnResizing: true,
        rowHeight: 31,
        showGridFooter: true,
        onRegisterApi: function(gridApi){
            $scope.gridApi = gridApi;


            $scope.gridApi.colResizable.on.columnSizeChanged($scope, function (colDef, deltaChange) {
                var val = parseInt(colDef['width']) + parseInt(deltaChange);
                saveCookie(colDef['colId'], val);
            });

        },
        columnDefs: [
            {
                name: 'Operacje',
                displayName: "Operacje",
                enableFiltering: false,
                cellTemplate: '<a style="text-align:center;" ng-click="openLicence(row)"><span class="glyphicon glyphicon-search open-button"></span></a>'
            },
            {
                name: 'Program.ProgramLine',
                displayName: "Linia",  
                cellTemplate: '<div class="ui-grid-cell-contents "   title="TOOLTIP" >{{grid.getCellValue(row, col)}} </div>'
            },
            {
                name: 'Program.ProgramVersion',
                displayName: "Wersja",
                cellTemplate: '<div class="ui-grid-cell-contents "   title="TOOLTIP" >{{grid.getCellValue(row, col)}}</div>'
            },
            {
               name: 'Program.ProgramDescription',
               displayName: "Opis",
               cellTemplate: '<div class="ui-grid-cell-contents "   title="TOOLTIP" >{{grid.getCellValue(row, col)}}</div>'
            },
            {
                name: 'Program.ProgramVersion',
                displayName: "Wersja",
                cellTemplate: '<div class="ui-grid-cell-contents "    title="TOOLTIP" >{{grid.getCellValue(row, col)}}</div>'
            },
            {
                name: 'Quantity',
                displayName: "Il. stanowisk",
                cellTemplate: '<div class="ui-grid-cell-contents "   title="TOOLTIP" >{{grid.getCellValue(row, col)}}</div>'
            },
            {
                name: 'SeriesNumber',
                displayName: "Nr seryjny",
                cellTemplate: '<div class="ui-grid-cell-contents "   title="TOOLTIP" >{{grid.getCellValue(row, col)}}</div>'
            },
            {
                name: 'SalesDocument',
                displayName: "Nr faktury",                 
                cellTemplate: '<div class="ui-grid-cell-contents "    title="TOOLTIP" >{{grid.getCellValue(row, col)}}</div>'
            },
            {
                name: 'SalesDocumentDate',
                displayName: "Data",
                cellTemplate: '<div class="ui-grid-cell-contents "    title="TOOLTIP" >{{grid.getCellValue(row, col) | date:\'yyyy-MM-dd\'}}</div>'

            },
            {
                name: 'Symfopakiet',
                displayName: "Gwarancja",
                filter:
                    {

                        type: uiGridConstants.filter.SELECT,
                        selectOptions: [{ value: 'Tak', label: 'Tak' }, { value: 'Nie', label: 'Nie' }]
                    },
                cellTemplate: '<div class="ui-grid-cell-contents "    title="TOOLTIP" >{{grid.getCellValue(row, col)}}</div>'
            },
            {
                name: 'SP_From',
                displayName: 'Do',
                cellTemplate: '<div class="ui-grid-cell-contents "   title="TOOLTIP" >{{grid.getCellValue(row, col)}}</div>'
            },
            {
                name: 'SP_From',
                displayName: 'Termin wypowiedzenia',
                cellTemplate: '<div class="ui-grid-cell-contents "   title="TOOLTIP" >{{grid.getCellValue(row, col) | date:\'yyyy-MM-dd\'}}</div>'
            }

        ],
        data:'licences'
    };

    $.each($scope.gridOptions.columnDefs, function (index) {
        var value = getValueByKey($scope.columnWidthTable, index);
        $scope.gridOptions.columnDefs[index].width = value == null ? 100 : value;
        $scope.gridOptions.columnDefs[index].colId = index;
    });

    function getValueByKey(array, id) {
        for (var i in array) {
            if (array[i].key == id)
                return array[i].val;
        }                           
        return null;
    }

    function setValueByKey(array, id, value) {
        for (var i in array) {
            if (array[i].key == id)
                 array[i].val=value;
        }
    }
person Mariusz Ślipko    schedule 09.11.2015