Search Posts

Category: ngtable

table rows are not properly aligned with table header in IE

I am facing issue when working with NgTableParams to show table in IE. It is showing correctly in chrome but the table row alignment is not proper in IE. Please find the demo In IE when you open the above link and Launch the preview window in separate page, you can notice the table rows are not properly matching with the table header.Any inputs? html: <div ng-controller=”BaseController”> <div class=”col-xs-5 container-paragraph”> <table ng-table=”tableParams” class=”table table-striped […]

How to remove the box shadow from table?

Got a query that I’ve been struggling with. I want to remove the shadow from my ng-tables when I hover over them, I was wondering how this is achieved: widget-body { background-color: #fbfbfb; -webkit-box-shadow: 1px 0 10px 1px rgba(0, 0, 0, 0.3); -moz-box-shadow: 1px 0 10px 1px rgba(0, 0, 0, 0.3); box-shadow: 1px 0 10px 1px rgba(0, 0, 0, 0.3); padding: 12px; } I’ve looked online for examples already but each time I’ve tried, […]

AngularJS: Ngtable reload to old data

So I’m using NGTable to display data on my page, the data are stored in an array and passed through the dataset param but when I programmatically change the value of a data in the array the changes are displayed correctly in the table BUT when I go to the second page for and go to the first page again the table display the old data. Here is a JSFiddle that illustrate my problem: […]

Date Range filter for ngTableDynamic

I need help to provide Date range (i.e. show only rows FROM to TO date range) filter for my NgTableDynamic tables for the “In Serv date” field. as of now it is filtering like text here is my code cpeList.json [ { “ucpeSerialNo”: “CPE_10”, “deviceType”: “uCPE”, “inServDate”: “07/31/17”, “location”: “Toronto”, “vendor”: “Juniper”, “ucpeModel”: “U410”, “comments”: “”, “comboid”: “70”, “nextAvailableDate”: “04/03/18”, “tcAssigned”: “PID->293618_TC->TC-A01 – Cascaded + vHNF – Dual Broadband” }, { “ucpeSerialNo”: “CPE_11”, “deviceType”: “uCPE”, […]

textbox values not changes when paging in angular table

how to textbox values not changes when paging in angular table I am using angular table for display my data. But i have a issues with it. i entered values in first page. when i go to second page, first page values still display. how i fix this. Please check below screen to understand my issue. $scope.tableParams = new NgTableParams({count:3}, {dataset:listOnhireContainers}); <table ng-table=”tableParams” class=”table table-condensed table-bordered table-striped table-scroll”> <tbody style=”width: 100%”> <tr ng-repeat=”SelectedContainer in $data […]

How to place a date picker inside the filter attribute of ng-table in AngularJS?

How to place a datepicker inside the filter attribute of ng-table in angularjs? Is this possible? any one who can help me about this case. Thank You in advance for those who have a kind heart! And Sorry for my noob question. id: ‘date’ is not working. this is my person.js and person-table.html (function() { var app = angular.module(“myApp”, [“ngTable”]); app.controller(“demoController”, demoController); function demoController(NgTableParams) { //MM-dd-yyyy var simpleList = [{ “name”: “Mark”, “birthDate”: “02-23-1999”, “age”: […]

Use directive to show/hide ngTable columns and headers

I’m trying to use a permission-based system in angular 1 to show/hide columns and their headers. The directive below works in terms of displaying the correct columns, however the headers all render, leaving a number of blank columns. View <div id=”scrollable-area”> <table ng-table=”vm.tableParams” class=”table” fixed-table-headers=”scrollable-area”> <tr ng-repeat=”row in $data” ng-class=”{‘selected’:row.rowId == rowId}” ng-click=”setClickedRow(row.rowId)”> <td permission=”[‘all_firms’, ‘firm_info’]” width=”40″ header=”‘headerCheckbox.html'”><input type=”checkbox” ng-model=”row.selected” /></td> <td permission=”[‘all_firms’, ‘firm_info’]” width=”10″ ng-if=”callType”><i class=”fa fa-microphone”ng-show=”row.audioInterface == ‘1’”></i></td> <td permission=”[‘all_firms’, ‘firm_info’]” data-title=”‘Username'” filter=”{ […]

ng table grouping : change header background color

I am using ng table with group mode, how can I modify the background color of the header? I can’t see the text on the left before up and down chevrons because of the blue background color. Here is my code : <table ng-table=”vm.tableParams” show-filter=”true” class=”table table-bordered table-hover” id=”dynamic-table”> <tr class=”ng-table-group” ng-repeat-start=”group in $groups”> <td colspan=”5″ data-title=”‘TEST1′”> <a href=”” ng-click=”group.$hideRows = !group.$hideRows” > <span class=”glyphicon” ng-class=”{ ‘glyphicon-chevron-right’: group.$hideRows, ‘glyphicon-chevron-down’: !group.$hideRows }”></span> <span>{{ group.value }}</span> </a> […]

How to change ngTable title colors programmatically?

In this plunk I have an ngTable that is created dynamically, setting progammatically the colors of the rows for each column. How to change the colors of the column titles? HTML: <table ng-table-dynamic=”tableParams with cols” class=”table table-bordered table-hover”> <tr ng-repeat=”row in data”> <td ng-repeat=”col in cols” ng-style=”{ ‘color’: col.color }”>{{row[col.nm]}}</td> </tr> </table> Javascript: var app = angular.module(‘app’, [‘ngTable’]); app.controller(‘myCtl’, function($scope,NgTableParams) { $scope.cols = [ {nm:’uid’, title:’User ID’, color: ‘blue’}, {nm:’ugr’, title: ‘Group ID’, color: ‘red’} […]

Next Page »