Trasformare Table HTML in file CSV

[JosaFat]

Ho un problema davvero complesso e la cui intera risoluzione è forse comunque impossibile. Ma quantomeno avvicinarsi a quanto desiderato sarebbe già un risultato.
Allora, io non sono propriamente un programmatore javascript, ne conosco le basi e basta lì; ciononostante per lavoro debbo passare sempre più tempo ad occuparmi di aspetti client, piuttosto che di quanto conosco meglio.

Abbiamo un sistema con un client web-based; le schermate di interrogazioni disegnano sul browser una <TABLE> html con abbondante uso di document.write
Alcuni queste interrogazioni hanno un tasto che attraverso la specificazione del mime-type di Excel, permettono di far rigenerare al server una pagina HTML e di farla aprire da Excel come se fosse un foglio di calcolo. Tutto funziona finché si usa M$; ma se sulla macchina c'è Open Office con Calc, non funziona.
La soluzione è quella di generare un file CSV, che viene ben gestito da tutte le applicazioni di foglio di calcolo.
Ma sarebbe anche importante riuscire a creare il benedetto file senza dover reinterrogare il server, in quanto alla fin fine, tutti i dati sono già sul client. Il problema è che non posso, ovviamente, accedere al filesystem del client da javascript. Ho provato ad aprire una window e di scriverci dentro con document.write, ma poi debbo comunque chiedere all'utente di salvarsi il contenuto della finestra (perché c'è il metodo print e non il metodo saveas???). Oltre a questo problema, non ho idea di come estrarre i dati dalla tabella HTML per scriverli in formato CSV...

Insomma, un problemone composito.
Sapete darmi qualche aiuto?

[artorius]

Tu, utilizzi tabelle complete?
ad esempio

Es Table
       <table id="table">
            <thead>
                <tr>
                    <th>Campo1</th>
                    <th>Campo2</th>
                    <th>Campo3</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>1</td>
                    <td>2</td>
                    <td>3</td>
                </tr>
                <tr>
                    <td>11</td>
                    <td>12</td>
                    <td>13</td>
                </tr>
                <tr>
                    <td>21</td>
                    <td>22</td>
                    <td>23</td>
                </tr>
                <tr>
                    <td>31</td>
                    <td>32</td>
                    <td>33</td>
                </tr>
                <tr>
                    <td>41</td>
                    <td>42</td>
                    <td>43</td>
                </tr>
            </tbody>
        </table> 

In questo caso ottieni l'elemento Table

var tab = document.getElementById('table'); //Valido
var csvStr = "";
var c, htr, h;
for(c = tab.firstChild; c != null; c = c.nextSibling)
{
  if(c.nodeType == 1)
  {
    if(c.nodeName.toLowerCase() == 'thead')
    {
      for(htr = c.firstChild; htr != null; htr = htr.nextSibling)
      {
         if(htr.nodeType==1)
         {
            for(h = htr.firstChild; h != null; h = h.nextSibling)
            {
               if(h.nodeType == 1)
               {
                  csvStr += "'"+h.innerHTML+"',";
               }
            }
         }
      }
      csvStr = csvStr.substring(0, csvStr.length - 1);
      csvStr += '\n';
    }
    
    
  }
}
    
for(c = tab.firstChild; c != null; c = c.nextSibling)
{
  if(c.nodeType == 1)
  {
    if(c.nodeName.toLowerCase() == 'tbody')
        {
          for(htr = c.firstChild; htr != null; htr = htr.nextSibling)
          {
             if(htr.nodeType==1)
             {
                for(h = htr.firstChild; h != null; h = h.nextSibling)
                {
                   if(h.nodeType == 1)
                   {
                      csvStr += "'"+h.innerHTML+"',";
                   }
                }
            csvStr = csvStr.substring(0, csvStr.length - 1);
            csvStr += '\n';
             }
          }
        }
    }
}
                
alert(csvStr); 

Dovrebbe andare bene, ma la tabella deve essere formata con il thead ed il tbody per assicurarsi di distinguere head e body del CVS

[cavicchiandrea]

@JosaFat Javascript non può creare nessun file.
@artorius Perdonami ma cosa centra con la richiesta.

[JosaFat]

Ringrazio Artorius, almeno un pezzo del problema è risolto.
Certo non è tutto, visto che ancora l'unico modo di creare il CSV è quello tutto manuale del salva manuale...
Peraltro devo ancora trovare come far digerire lo stesso CSV a Excel e Calc, ma quello esula da questo forum.

[artorius]

mmm, potresti sempre fare una cosa non tanto bella, ma funzionale.

Ti crei un file in un qualsiasi linguaggio scripting (PHP, ASP, JSP) che prende una stringa passata in POST e la torna in allegato alla pagina come se fosse un file.

Poi dopo aver ottenuto la stringa CSV, crei una form, via javascript, method post, action la pagina descritta sopra, ci appendi un textarea con value la stringa CSV, appendi la form al body, e fai subito submit ed il gioco è fatto, l'utente vede solo un file in download.

[mymail]

Originariamente inviato da artorius
Tu, utilizzi tabelle complete?
ad esempio

Es Table
       <table id="table">
            <thead>
                <tr>
                    <th>Campo1</th>
                    <th>Campo2</th>
                    <th>Campo3</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>1</td>
                    <td>2</td>
                    <td>3</td>
                </tr>
                <tr>
                    <td>11</td>
                    <td>12</td>
                    <td>13</td>
                </tr>
                <tr>
                    <td>21</td>
                    <td>22</td>
                    <td>23</td>
                </tr>
                <tr>
                    <td>31</td>
                    <td>32</td>
                    <td>33</td>
                </tr>
                <tr>
                    <td>41</td>
                    <td>42</td>
                    <td>43</td>
                </tr>
            </tbody>
        </table> 

Salve, io ho un problema di questo tip, ho una tabella gia' costruita da cui voglio andare a prendere i valori per poi effettuarne una sommatoria.
Per esempio nella tabella che c'è qui riportata in alto se volessi mettere in una variabile il valore 31 e poi 32 poi 33 come faccio??? io avevo pensato x=<td>31</td> ma evidentemente ho pensato male perche' non funge, solo un'ultima cosa non si tratta di numeri bensi di caratteri.Illuminatemi per favore

[JosaFat]

Guarda caso, la discussione si rianima, proprio mentre sto tornando ad occuparmi di questo problema. La soluzione dello script che invia al server i dati, per far generare il file rimane la miglior idea, per quanto sia comunque teoricamente un bel via-vai di dati.

Rispondo a mymail: se guardi il codice di artorius, vedi come puoi ottenere da javascript i valori scritti in una table. Ti basta andare a cercarti i valori che ti servono, leggerli, sommarli e fare tutto quello che ti serve.