javascript - Download Table to excel With hidden rows with ng-repeat -
i have table created using ng-repeat. in table have used ng-repeat-start , ng-repeat-end in order hide row visible when user wants see it. problem when try export table excel rows visible appear in excel there rows linked each other appear different rows(as in table different rows). want rows whether visible or not should appear in excel. there way 2 rows linked each other(as contain data related 1 single instance) can appear single row in excel. here code
function myctrl($scope) { $scope.exportdata = function () { var table = document.getelementbyid('exportable'); var html = table.outerhtml; window.open('data:application/vnd.ms-excel,' + encodeuricomponent(html)); }; $scope.items = [{ "name": "name1", "date": "10/02/2014", "terms": ["samsung", "nokia", "apple"] }, { "name": "name2", "date": "10/02/2014", "terms": ["motrolla", "nokia", "iphone"] }] }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <body ng-app> <div ng-controller="myctrl"> <button ng-click="exportdata()" >export</button> <br /> <table width="100%" id='exportable'> <thead> <tr > <th></th> <th>name</th> <th>date</th> <th>terms</th> </tr> </thead> <tbody> <tr ng-repeat-start="item in items"> <td>{{item.name}}</td> <td>{{item.date}}</td> <td><span ng-repeat="term in item.terms">{{term}}{{!$last?', ':''}}</span></td> <td> <button ng-click="item.expanded=true"> more </button> </td> </tr> <tr ng-repeat-end ng-if="item.expanded"> <td colspan=''> </td> <td colspan=''> hello </td> <td > <button ng-click="item.expanded=false"> hide </button> </td> </tr> </tbody> </table> </div> </body>
here fiddle appreciated thanks.
use ng-show
insted of ng-if
fiddle
<tr ng-repeat-end ng-show="item.expanded">
Comments
Post a Comment