jquery - Dynamically add columns to table (with colResizable plugin) -
i'm using plugin colresizable manipulate column width. being able dynamically add columns. tried that:
<body ng-controller='myctrl'> <table style="width: 100%;height:300px" col-resizeable> <tr> <td ng-repeat='column in columns track $index' ng-style="{'background':column}">content</td> </tr> </table> <button type='button' ng-click="addcolumn()">add</button> </body>
here plunker (the add button supposed add green column)
http://plnkr.co/edit/8rfoyoqvz3frk53192tx?p=preview
with no success. can tell i'm doing wrong?
edit: here how add column...
$scope.addcolumn = function(){ $scope.columns.push('green'); }
any reason why need $timeout ? if remove work
myapp.directive('colresizeable', function($interval) { return { restrict: 'a', link: function(scope, elem) { elem.colresizable({ livedrag: true, gripinnerhtml: "<div class='grip'></div>", draggingclass: "dragging", ondrag: function() { //trigger resize event, paren-witdh directive updated //$(window).trigger('resize'); } }); } }; });
other solution watch "columns" , disabled & re-enable colresizable everytime change.
Comments
Post a Comment