2013-03-05 24 views
12


Sto provando a convertire le tabelle HTML in Excel, ho provato con una funzione JavaScript che converte una tabella semplice in Excel, funziona perfettamente. Se ho più tabelle, come sarò in grado di aggiungere tutti i dati della tabella nel file Excel. ecco cosa ho provato Ho creato 2 tabelle e indicato l'indice di tabella testTable e testTable1.JavaScript - esportazione dati tabella HTML in Excel

Come passare questi 2 ID di tabella alla funzione JavaScript al clic del pulsante? proprio ora al clic del pulsante solo la prima tabella viene esportata in Excel mentre sto passando solo 'testTable'. in che modo sarà possibile esportare più tabelle, ad esempio: testTable, testTable1 in Excel?

Ecco il JavaScript:

<script> 

var tableToExcel = (function() { 
var uri = 'data:application/vnd.ms-excel;base64,' 
, template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><!--[if gte mso 9]>  
<xml> 
<x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet} 
</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions> 
</x:ExcelWorksheet></x:ExcelWorksheets> 
</x:ExcelWorkbook> 
</xml> 
<![endif]--> 
</head> 
<body> 
<table>{table}</table></body></html>' 
, base64 = function(s) { return window.btoa(unescape(encodeURIComponent(s))) } 
, format = function(s, c) { return s.replace(/{(\w+)}/g, function(m, p) { return c[p]; }) } 
return function(table, name) { 
if (!table.nodeType) table = document.getElementById(table) 
var ctx = {worksheet: name || 'Worksheet', table: table.innerHTML} 
window.location.href = uri + base64(format(template, ctx)) 
} 
})() 

</script> 

Ecco la parte HTML,

<table id="testTable"> 
    <thead> 
     <tr> 
      <th>Name</th> 
      <th>ACP</th> 
      <th>OEMCP</th> 
      <th>Unix<br> 
       NT 3.1</th> 
      <th>Unix<br> 
       NT 3.51</th> 
      <th>Unix<br> 
       95</th> 
     </tr> 
    </thead> 
</table> 
<table id="testTable1"> 
    <thead> 
     <tr> 
      <th>Name</th> 
      <th>ACP</th> 
      <th>OEMCP</th> 
      <th>Windows<br> 
       NT 3.1</th> 
      <th>Windows<br> 
       NT 3.51</th> 
      <th>Windows<br> 
       95</th> 
     </tr> 
    </thead> 
</table> 

prega fatemi sapere, come questo può essere fatto?
Grazie

+0

non è possibile utilizzare il servizio web per questo problema. Funzionerà anche senza postback. – osmanraifgunes

risposta

9

vi consiglio un altro metodo Format. il micro-template di John Resig è uno strumento molto buono e semplice per fare ciò di cui hai bisogno. (ejohn microtemplating)

(function(){ 
    var cache = {}; 

    this.tmpl = function tmpl(str, data){ 
    // Figure out if we're getting a template, or if we need to 
    // load the template - and be sure to cache the result. 
    var fn = !/\W/.test(str) ? 
     cache[str] = cache[str] || 
     tmpl(document.getElementById(str).innerHTML) : 

     // Generate a reusable function that will serve as a template 
     // generator (and which will be cached). 
     new Function("obj", 
     "var p=[],print=function(){p.push.apply(p,arguments);};" + 

     // Introduce the data as local variables using with(){} 
     "with(obj){p.push('" + 

     // Convert the template into pure JavaScript 
     str.replace(/[\r\t\n]/g, " ") 
       .split("{{").join("\t") 
       .replace(/((^|}})[^\t]*)'/g, "$1\r") 
       .replace(/\t=(.*?)}}/g, "',$1,'") 
       .split("\t").join("');") 
       .split("}}").join("p.push('") 
       .split("\r").join("\\'") 
       + "');}return p.join('');"); 

    // Provide some basic currying to the user 
    return data ? fn(data) : fn; 
    }; 
})(); 

E 'molto semplice da usare. Ciò consente non solo di mostrare le variabili tra HTML ma anche di eseguire il codice JavaScript

La stringa di modello necessita di alcune modifiche per funzionare con questo microtemplate.

{{for(var i=0; i<tables.length;i++){ }} 
    <table> 
     {{=tables[i]}} 
    </table> 
{{ } }} 

infine, solo bisogno di selezionare tutte le tabelle che appaiono nel tuo esempio

document.getElementsByTagName("table"); 

si può vedere come funziona http://jsfiddle.net/Scipion/P8rpn/1/

+0

Grazie mille Scipion! Volevo solo sapere se posso fare questa funzionalità al clic di un pulsante html ... Ho provato con questo ma questo non funziona ... Come funziona su jsFiddle? Se implemento lo stesso in html non riesco a ottenere il file al clic del pulsante. Gentilmente fammi sapere se è possibile. – shockwave

+1

provare e aggiungerlo all'evento click.function download() { tableToExcel (document.getElementsByTagName ("table"), "one"); } var btn = document.getElementById ("btn"); btn.addEventListener ("clic", download); http://jsfiddle.net/Scipion/P8rpn/3/ – Scipion

+0

Grazie mille !! Questo ha funzionato come un fascino! :) – shockwave

0

creano una funzione e passare l'IDtabella ad esso

function passing_id_to_excel(tableID){ 
    var myTableid = 
document.getElementById(tableID) //remaining code } 
+0

Come faccio a passare più tableIDs? – shockwave

0
  1. Aggiungere una casella di controllo per ogni tabella. Usa javascript per elaborare quelli che sono stati controllati.
  2. Nel caso in cui si desideri convertire solo tutti i tavoli, è possibile utilizzare $('table').each(function() { do something }).
Problemi correlati