Newsgroup: it.comp.lang.javascript
Titolo: stampare a video una tabella in stile excel

come posso fare per stampare a video una tabella con dei dati presi da un
database, di modo che le colonne si possano allargare con il mouse tipo
quelle di excell?
--------------------------------
Inviato via 
http://arianna.libero.it/usenet/

 quelle di excell?
In attesa di cosa dicono gli altri che magari postano qualche link...
ti ho preparato una pagina anche per capire se e' piu' o meno quello che volevi:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd
">
<html xmlns="
http://www.w3.org/1999/xhtml
">
<head>
<title>Excel Table</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
<!--
table, tr, th, td {
 border: 1px solid #CCCCCC;
}
th {
 width: 20px;
 height: 20px;
 padding-left: 10px;
 background-color: #AAA;
}
th div {
 width: 10px;
 height: 100%;
 float: right;
 cursor: w-resize;
}
-->
</style>
<script type="text/javascript">
var colMouseDown=false;
var posMouseX=0;
function allargaEstring(thId,event)
{
 var posMouseXTmp=event.x;
 if(colMouseDown)
  document.getElementById(thId).style.width=eval(parseInt(document.getElementById(thId).style.width)-posMouseX+posMouseXTmp)+'px';
 posMouseX=posMouseXTmp;
}
function mettiDivMove(thId)
{
 document.write('<div onmousedown="colMouseDown=true" onmouseup="colMouseDown=false" onmouseover="this.style.cursor=\'w-resize\'" onmouseout="colMouseDown=false;this.style.cursor=\'default\'" onmousemove="allargaEstring(\''+thId+'\',event)"></div>');
}
</script>
</head>
<body>
<table cellpadding="0" cellspacing="0">
  <tr>
    <th>&nbsp;</th>
    <th id="col_A" style="width: 80px"><script type="text/javascript">mettiDivMove('col_A')</script>A</th>
    <th id="col_B" style="width: 80px"><script type="text/javascript">mettiDivMove('col_B')</script>B</th>
    <th id="col_C" style="width: 80px"><script type="text/javascript">mettiDivMove('col_C')</script>C</th>
    <th id="col_D" style="width: 80px"><script type="text/javascript">mettiDivMove('col_D')</script>D</th>
  </tr>
  <tr>
    <th>1</th>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <th>2</th>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <th>3</th>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <th>4</th>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>
</body>
</html>
PS
Questo e' solo un esempio affrettato e neanche molto ben funzionante, pero' e' un inizio...
sicuramente ti potrebbe essere utile:
http://www.walterzorn.com/dragdrop/dragdrop_e.htm
op
http://www.dhtmlcentral.com


Grazie sei stato molto gentile, ma penso che lascerò perdere, da troppi
problemi di compatibilità, con mozilla non funziona


 problemi di compatibilità, con mozilla non funziona
Guarda ci deve essere un errore da qualche parte che mi deve essere sfuggito nel cercare di ridurre un po' il codice, prima funzionava...
Comunque era evidente che non fosse la miglior soluzione, era forse la piu' veloce da capire ed era solo un'idea... ma visto che senza grossi problemi sono riuscito a mettere in atto qualcosa, forse ti conviene dare un'occhiata ai siti che ti do detto e sono convinto che si riesce a fare un bel lavoro...
Poi aspetta che quasi sicuramente e' una cosa che e' gia' stata fatta e se qualcuno di desse il link...

 un po' il codice
Eccolo, bisogna sostituire la riga:
var posMouseXTmp=event.x;
con:
var posMouseXTmp=event.layerX||event.x;
Ma poi come ti ho gia' detto era anche per capire se era quello che
cercavi...