javascript - TableTools - Export to Excel not working -
i have datatable view want export excel. tried use tabletools plugin. did't find step step tutorial how use problem "excel" button doing nothing.
my code in test html:
<!doctype html> <html> <head> <title>test</title> <!-- general libraries --> <script type="text/javascript" charset="utf8" src="//datatables.net/release-datatables/media/js/jquery.js"></script> <script type="text/javascript" charset="utf8" src="//datatables.net/release-datatables/media/js/jquery.datatables.js"></script> <script type="text/javascript" charset="utf8" src="//datatables.net/release-datatables/extensions/tabletools/js/datatables.tabletools.js"></script> <link rel="stylesheet" type="text/css" href="//datatables.net/release-datatables/media/css/jquery.datatables.css"> <link rel="stylesheet" type="text/css" href="//datatables.net/release-datatables/extensions/tabletools/css/datatables.tabletools.css"> </head> <body> <script type="text/javascript"> $(document).ready(function() { $('#example').datatable( { "sdom": 't<"clear">lfrtip', "otabletools": { "abuttons": [ "xls" ] } } ); var ttinstances = tabletools.fngetmasters(); (var j in ttinstances) { ttinstances[j].fnresizebuttons();}; } ); </script> <table id="example" class="display" cellspacing="0" width="100%"> <thead> <tr> <th>name</th> <th>position</th> <th>office</th> <th>age</th> <th>start date</th> <th>salary</th> </tr> </thead> <tfoot> <tr> <th>name</th> <th>position</th> <th>office</th> <th>age</th> <th>start date</th> <th>salary</th> </tr> </tfoot> <tbody> <tr> <td>tiger nixon</td> <td>system architect</td> <td>edinburgh</td> <td>61</td> <td>2011/04/25</td> <td>$320,800</td> </tr> <tr> <td>garrett winters</td> <td>accountant</td> <td>tokyo</td> <td>63</td> <td>2011/07/25</td> <td>$170,750</td> </tr> <tr> <td>ashton cox</td> <td>junior technical author</td> <td>san francisco</td> <td>66</td> <td>2009/01/12</td> <td>$86,000</td> </tr> <tr> <td>cedric kelly</td> <td>senior javascript developer</td> <td>edinburgh</td> <td>22</td> <td>2012/03/29</td> <td>$433,060</td> </tr> <tr> <td>airi satou</td> <td>accountant</td> <td>tokyo</td> <td>33</td> <td>2008/11/28</td> <td>$162,700</td> </tr> <tr> <td>brielle williamson</td> <td>integration specialist</td> <td>new york</td> <td>61</td> <td>2012/12/02</td> <td>$372,000</td> </tr> <tr> <td>herrod chandler</td> <td>sales assistant</td> <td>san francisco</td> <td>59</td> <td>2012/08/06</td> <td>$137,500</td> </tr> <tr> <td>rhona davidson</td> <td>integration specialist</td> <td>tokyo</td> <td>55</td> <td>2010/10/14</td> <td>$327,900</td> </tr> <tr> <td>colleen hurst</td> <td>javascript developer</td> <td>san francisco</td> <td>39</td> <td>2009/09/15</td> <td>$205,500</td> </tr> <tr> <td>sonya frost</td> <td>software engineer</td> <td>edinburgh</td> <td>23</td> <td>2008/12/13</td> <td>$103,600</td> </tr> <tr> <td>jena gaines</td> <td>office manager</td> <td>london</td> <td>30</td> <td>2008/12/19</td> <td>$90,560</td> </tr> <tr> <td>quinn flynn</td> <td>support lead</td> <td>edinburgh</td> <td>22</td> <td>2013/03/03</td> <td>$342,000</td> </tr> <tr> <td>charde marshall</td> <td>regional director</td> <td>san francisco</td> <td>36</td> <td>2008/10/16</td> <td>$470,600</td> </tr> <tr> <td>haley kennedy</td> <td>senior marketing designer</td> <td>london</td> <td>43</td> <td>2012/12/18</td> <td>$313,500</td> </tr> <tr> <td>tatyana fitzpatrick</td> <td>regional director</td> <td>london</td> <td>19</td> <td>2010/03/17</td> <td>$385,750</td> </tr> <tr> <td>michael silva</td> <td>marketing designer</td> <td>london</td> <td>66</td> <td>2012/11/27</td> <td>$198,500</td> </tr> <tr> <td>paul byrd</td> <td>chief financial officer (cfo)</td> <td>new york</td> <td>64</td> <td>2010/06/09</td> <td>$725,000</td> </tr> <tr> <td>gloria little</td> <td>systems administrator</td> <td>new york</td> <td>59</td> <td>2009/04/10</td> <td>$237,500</td> </tr> <tr> <td>bradley greer</td> <td>software engineer</td> <td>london</td> <td>41</td> <td>2012/10/13</td> <td>$132,000</td> </tr> <tr> <td>dai rios</td> <td>personnel lead</td> <td>edinburgh</td> <td>35</td> <td>2012/09/26</td> <td>$217,500</td> </tr> <tr> <td>jenette caldwell</td> <td>development lead</td> <td>new york</td> <td>30</td> <td>2011/09/03</td> <td>$345,000</td> </tr> <tr> <td>yuri berry</td> <td>chief marketing officer (cmo)</td> <td>new york</td> <td>40</td> <td>2009/06/25</td> <td>$675,000</td> </tr> <tr> <td>caesar vance</td> <td>pre-sales support</td> <td>new york</td> <td>21</td> <td>2011/12/12</td> <td>$106,450</td> </tr> <tr> <td>doris wilder</td> <td>sales assistant</td> <td>sidney</td> <td>23</td> <td>2010/09/20</td> <td>$85,600</td> </tr> <tr> <td>angelica ramos</td> <td>chief executive officer (ceo)</td> <td>london</td> <td>47</td> <td>2009/10/09</td> <td>$1,200,000</td> </tr> <tr> <td>gavin joyce</td> <td>developer</td> <td>edinburgh</td> <td>42</td> <td>2010/12/22</td> <td>$92,575</td> </tr> <tr> <td>jennifer chang</td> <td>regional director</td> <td>singapore</td> <td>28</td> <td>2010/11/14</td> <td>$357,650</td> </tr> <tr> <td>brenden wagner</td> <td>software engineer</td> <td>san francisco</td> <td>28</td> <td>2011/06/07</td> <td>$206,850</td> </tr> <tr> <td>fiona green</td> <td>chief operating officer (coo)</td> <td>san francisco</td> <td>48</td> <td>2010/03/11</td> <td>$850,000</td> </tr> <tr> <td>shou itou</td> <td>regional marketing</td> <td>tokyo</td> <td>20</td> <td>2011/08/14</td> <td>$163,000</td> </tr> <tr> <td>michelle house</td> <td>integration specialist</td> <td>sidney</td> <td>37</td> <td>2011/06/02</td> <td>$95,400</td> </tr> <tr> <td>suki burks</td> <td>developer</td> <td>london</td> <td>53</td> <td>2009/10/22</td> <td>$114,500</td> </tr> <tr> <td>prescott bartlett</td> <td>technical author</td> <td>london</td> <td>27</td> <td>2011/05/07</td> <td>$145,000</td> </tr> <tr> <td>gavin cortez</td> <td>team leader</td> <td>san francisco</td> <td>22</td> <td>2008/10/26</td> <td>$235,500</td> </tr> <tr> <td>martena mccray</td> <td>post-sales support</td> <td>edinburgh</td> <td>46</td> <td>2011/03/09</td> <td>$324,050</td> </tr> <tr> <td>unity butler</td> <td>marketing designer</td> <td>san francisco</td> <td>47</td> <td>2009/12/09</td> <td>$85,675</td> </tr> <tr> <td>howard hatfield</td> <td>office manager</td> <td>san francisco</td> <td>51</td> <td>2008/12/16</td> <td>$164,500</td> </tr> <tr> <td>hope fuentes</td> <td>secretary</td> <td>san francisco</td> <td>41</td> <td>2010/02/12</td> <td>$109,850</td> </tr> <tr> <td>vivian harrell</td> <td>financial controller</td> <td>san francisco</td> <td>62</td> <td>2009/02/14</td> <td>$452,500</td> </tr> <tr> <td>timothy mooney</td> <td>office manager</td> <td>london</td> <td>37</td> <td>2008/12/11</td> <td>$136,200</td> </tr> <tr> <td>jackson bradshaw</td> <td>director</td> <td>new york</td> <td>65</td> <td>2008/09/26</td> <td>$645,750</td> </tr> <tr> <td>olivia liang</td> <td>support engineer</td> <td>singapore</td> <td>64</td> <td>2011/02/03</td> <td>$234,500</td> </tr> <tr> <td>bruno nash</td> <td>software engineer</td> <td>london</td> <td>38</td> <td>2011/05/03</td> <td>$163,500</td> </tr> <tr> <td>sakura yamamoto</td> <td>support engineer</td> <td>tokyo</td> <td>37</td> <td>2009/08/19</td> <td>$139,575</td> </tr> <tr> <td>thor walton</td> <td>developer</td> <td>new york</td> <td>61</td> <td>2013/08/11</td> <td>$98,540</td> </tr> <tr> <td>finn camacho</td> <td>support engineer</td> <td>san francisco</td> <td>47</td> <td>2009/07/07</td> <td>$87,500</td> </tr> <tr> <td>serge baldwin</td> <td>data coordinator</td> <td>singapore</td> <td>64</td> <td>2012/04/09</td> <td>$138,575</td> </tr> <tr> <td>zenaida frank</td> <td>software engineer</td> <td>new york</td> <td>63</td> <td>2010/01/04</td> <td>$125,250</td> </tr> <tr> <td>zorita serrano</td> <td>software engineer</td> <td>san francisco</td> <td>56</td> <td>2012/06/01</td> <td>$115,000</td> </tr> <tr> <td>jennifer acosta</td> <td>junior javascript developer</td> <td>edinburgh</td> <td>43</td> <td>2013/02/01</td> <td>$75,650</td> </tr> <tr> <td>cara stevens</td> <td>sales assistant</td> <td>new york</td> <td>46</td> <td>2011/12/06</td> <td>$145,600</td> </tr> <tr> <td>hermione butler</td> <td>regional director</td> <td>london</td> <td>47</td> <td>2011/03/21</td> <td>$356,250</td> </tr> <tr> <td>lael greer</td> <td>systems administrator</td> <td>london</td> <td>21</td> <td>2009/02/27</td> <td>$103,500</td> </tr> <tr> <td>jonas alexander</td> <td>developer</td> <td>san francisco</td> <td>30</td> <td>2010/07/14</td> <td>$86,500</td> </tr> <tr> <td>shad decker</td> <td>regional director</td> <td>edinburgh</td> <td>51</td> <td>2008/11/13</td> <td>$183,000</td> </tr> <tr> <td>michael bruce</td> <td>javascript developer</td> <td>singapore</td> <td>29</td> <td>2011/06/27</td> <td>$183,000</td> </tr> <tr> <td>donna snider</td> <td>customer support</td> <td>new york</td> <td>27</td> <td>2011/01/25</td> <td>$112,000</td> </tr> </tbody> </table> </body> </html> if replace ready function one:
<script type="text/javascript"> $(document).ready(function() { $('#example').datatable( { "sdom": 't<"clear">lfrtip', "otabletools": { "sswfpath": "//cdn.datatables.net/tabletools/2.2.2/swf/copy_csv_xls_pdf.swf" } } ); var ttinstances = tabletools.fngetmasters(); (var j in ttinstances) { ttinstances[j].fnresizebuttons();}; } ); </script> everything works ok. please note didn't download tabletools locally. suggestions how resolve issue?
solution
you need specify swf file sswfpath in order "excel" button work.
$(document).ready( function () { $('#example').datatable( { "dom": 't<"clear">lfrtip', "tabletools": { "sswfpath": "//cdn.datatables.net/tabletools/2.2.4/swf/copy_csv_xls.swf", "abuttons": [ "xls" ] } }); }); notes
you loading swf //cdn.datatables.net code //datatables.net.
load code //cdn.datatables.net shown below:
<!-- general libraries --> <script type="text/javascript" charset="utf8" src="//code.jquery.com/jquery-1.11.1.min.js"></script> <script type="text/javascript" charset="utf8" src="//cdn.datatables.net/1.10.7/js/jquery.datatables.min.js"></script> <script type="text/javascript" charset="utf8" src="//cdn.datatables.net/tabletools/2.2.4/js/datatables.tabletools.min.js"></script> <link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.7/css/jquery.datatables.min.css"> <link rel="stylesheet" type="text/css" href="//cdn.datatables.net/tabletools/2.2.4/css/datatables.tabletools.min.css"> according this post allan jardine, creator of datatables, regarding using datatables.net:
datatables.net not cdn server , should not used such. not designed be, , might add throttling hotlinking in future huge amount of bandwidth being used , causing unnecessary load.
Comments
Post a Comment