使用 ag-grid headerCellRenderer 加入 select 或 input 時避免觸發排序

.directive("stoppropagation", function () {
        return {
            link: function (scope, element, attrs, ngModel) {
              element.on('click', function (event) {
                    event.stopPropagation();
                });
            }
        }
    })

使用 ag-grid cellrenderer 實作 CRUD 輸入文字時避免方向鍵造成焦點跑掉且自動將焦點停在input

在 input 中加入directive，select 也適用

.directive("stoppropagation", function () {
        return {
            link: function (scope, element, attrs, ngModel) {
                element.on('keydown', function (event) {
                    var key = event.which || event.keyCode;
                    if (key >= 37 || key <= 40 || key==9) {
                        event.stopPropagation();
                    }
                });
            }
        }
    })


cellrenderer 中加入
params.eGridCell.addEventListener('focus', function (event) { event.srcElement.firstChild.focus(); event.srcElement.firstChild.select(); });
PS. 若為文字方塊再加入 event.srcElement.firstChild.select(); 以便自動全選

使用頁籤效果切換顯示資料

<uib-tabset active="activeTab" > <uib-tab index="0" heading="繳款明細"> <div id="div繳款明細" ng-style="getTableHeightTab('div繳款明細')" ag-grid="gridOptionsPay" class="ag-green"></div> </uib-tab> <uib-tab index="1" heading="憑證明細"> <div id="div憑證明細" ng-style="getTableHeightTab('div憑證明細')" ag-grid="gridOptionsInvoice" class="ag-green"></div> </uib-tab> </uib-tabset>

透過css 調整底色方式

 .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {

        background-color: aqua;

    }

※$scope.activeTab=目前顯示tab 的index