Plateforme Level Extreme
Abonnement
Profil corporatif
Produits & Services
Support
Légal
English
Tricky problem for ng-repeat directive
Message
 
 
À
29/04/2015 03:48:53
Information générale
Forum:
Javascript
Catégorie:
Autre
Divers
Thread ID:
01619110
Message ID:
01619220
Vues:
28
>>Hi Viv,
>>
>>I got it working based on the idea I had this weekend of introducing another list type of the property (e.g. returning list of the boolean columns). So, this is my current code:
>>
>>
>><table id="searchTable" ng-show="results.length>0"
>>                           class="table table-responsive table-hover table-list"
>>                           style="width:800px;">
>>                        <thead>
>>                            <tr style='-moz-user-select: none; -webkit-user-select: none; -ms-user-select:none; user-select:none;'>
>>                                <th ng-repeat="column in table.columns" ng-click="sort(column)"
>>                                    ng-attr-style="width:{{(column.width===undefined) ? 'auto' : column.width + '%' }}">
>>                                    {{column.displayName === undefined?column.name:column.displayName}}
>>                                    <span class="pull-right" href="#" ng-show="column.name === table.sort">
>>                                        <i ng-class="{'fa fa-chevron-down': table.dir === 'asc', 'fa fa-chevron-up': table.dir === 'desc'}"></i>
>>                                    </span>
>>                                </th>
>>                           
>>                                <th ng-repeat="licenseInfo in results[0].licenses">
>>                                    {{licenseInfo.licenseType}}
>>                                </th>
>>                            </tr>
>>                        </thead>
>>                        <tbody>
>>                            <tr ng-repeat="result in results" ng-form="licenseRow">
>>                                <td>
>>                                    {{ result.salespoint }}
>>                                </td>
>>                                <td>
>>                                    {{ result.id }}
>>                                </td>
>>                                <td>
>>                                    {{ result.description }}
>>                                </td>
>>                                <td>
>>                                    <select class="form-control" ng-model="result.mode"
>>                                            ng-options="s.modeId as s.description for s in metaData.salespointModes"></select>
>>                                </td>
>>                                <td ng-repeat="licenseInfo in result.licenses">
>>                                    <input type="checkbox"
>>                                           ng-model="licenseInfo.activated"
>>                                           name="activated"
>>                                           id="activated"
>>                                           ng-change="licenseActivationChanged(licenseInfo.licenseType)" />
>>                                </td>
>>                            </tr>
>>                        </tbody>
>>                    </table>
>>
>>Looks ok, but now I also want to have first 4 columns to be locked and the rest to be scrollable. I found this http://stackoverflow.com/questions/1312236/how-do-i-create-an-html-table-with-fixed-frozen-left-column-and-scrollable-body but it's for one column only.
>>
>>
>>>Couple of possible approaches in this thread which should be adaptable to your needs :
>>>http://stackoverflow.com/questions/18357370/angularjs-building-a-dynamic-table-based-on-a-json
>
>Found this (uses a jQuery plugin) : http://datatables.net/release-datatables/extensions/FixedColumns/examples/two_columns.html

Looks great, but I'm not yet sure how the DataTables will fit into what I already have. I'll try to experiment a bit.

Thanks.
If it's not broken, fix it until it is.


My Blog
Précédent
Répondre
Fil
Voir

Click here to load this message in the networking platform