Hi everyone, I am rendering a table like this
<div ng:controller="controller" class="gridTableContainer">
<div ng:model="list" ng:repeat="portfolio in list" class="gridHelper">
<table class="table table-bordered">
<thead>
<tr>
<thclass="fixedColumn">
<p
ng-click="SortByStringField('InstrumentName')">Name<i class="sort"></i></p>
<p
ng-click="SortByStringField('ISIN')">ISIN<i class="sort"></i></p>
</th>
<th>
<p
ng-click="SortByNumberField('Size')">Size<i class="sort"></i></p>
</th>
<th>
<p
ng-click="SortByNumberField('CurrentQuote')">akt. Kurs<i class="sort"></i></p>
<p
ng-click="SortByNumberField('CurrentWorth')">akt. Wert<i class="sort"></i></p>
</th>
<th>
<p>Kaufpreis</p>
</th>
<th>
<p>+/- heute</p>
<p>% heute</p>
<p>Wertentw. heute</p>
</th>
<th>
<p>+/- gesamt</p>
<p>% gesamt</p>
<p>Wertentw. gesamt</p>
</th>
<th>
<p>Optionen</p>
</th>
<th>
<p>Handeln</p>
</th>
</tr>
</thead>
<tbody ng:repeat="component in portfolio.Components">
<tr class="gridIndiceSection">
<td>
<p>{{component.InstrumentName}}</p>
<p>{{component.ISIN}}</p>
</td>
<td>
<p>{{calculateComponentSize(component)}}</p>
</td>
<td align="right"
class="gridTableBodyElement">
<p>{{component.CurrentQuote|
currency}}</p>
<p>{{component.CurrentWorth|
currency}}</p>
</td>
<td>
<p>{{component.BuyingQuote |
currency}}</p>
<p>{{component.BuyingWorth |
currency}}</p>
<p >{{component.BuyingDate |
date:'MM-dd-yyyy HH:MM:ss'}}</p>
</td>
<td align="right"
class="gridTableBodyElement">
<p>{{component.ChangeTodayAbsolute | number:2}}</p>
<p>{{component.ChangeTodayRelative | number:2}}</p>
<p>{{component.ChangeTodayAbsolutePerformance | number:2}}</p>
</td>
<td>
<p>{{component.ChangeOverallAbsolute | number:2}}</p>
<p>{{component.ChangeOverallRelative | number:2}}</p>
<p>{{component.ChangeOverallAbsolutePerformance | number:2}}</p>
</td>
<td>
<button></button>
</td>
<td>
<button class="gridBuy"
title="Kaufen">K</button>
<button
class="gridSell" title="Verkaufen">V</button>
</td>
</tr>
</tbody>
</table>
<script type="text/javascript">
var myapp = angular.module('myapp', ['ui', 'ui.bootstrap']);
myapp.controller('controller', function ($scope, $http) {
$scope.list = [];
$scope.sortCache = {};
$http.get("/GetPortfolio/@ViewBag.SelectedId").then(function
(result) {
$scope.list = result.data;
});
</script>
The first column is fixed. I managed that with css. But the rest of the columns
should be reorderable by drag and drop! I tried several
jQuery-Plugins but none of them is working. For example I used
http://www.jqueryscript.net/table/Simple-jQuery-Plugin-For-Draggable-Table-Columns-Dragtable.html
that works fine with standard html and table. But if I try to implement it for
my angular table it doesn't work at all.
Hopefully someone can help me out
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
