Utente:Alex brollo/Tabella attiva

Da Wikisource.
Jump to navigation Jump to search
versione preliminare
istruzioni dirette
// creazione box
$('<div ondblclick="delShow()" style="line-height:1em; background-color:#FCFCFC; font-family:Courier; font-size:0.8pc; position:absolute; width:100%; height:100%; top:0px; right:0px; z-index:999; border:1px solid #bbb;" id="showCode"></div>').appendTo($("#mw-content-text")); 
// creazione tabella
$("#showCode").append($('<table class="tabella" border="1" cellspacing="0" cellpadding="2" width="100%" ></table'));

// aggiunta righe 1-5
for (i=1;i<6;i+=1) {html='<tr class="riga'+i+'"></tr>';$(".tabella").append($(html)); }

// aggiunta colonne 1-4
$("tr",$(".tabella")).each(function() {for (i=1;i<5;i+=1) {var classe=$(this).attr("class"); var html='<td class="'+classe+' '+'colonna'+i+'"> </td>';$(this).append($(html)); }})

r1=["Dante Alighieri","1265","14 settembre 1321","poeta, scrittore e politico italiano"];
r2=["Durante di Alighiero degli Alighieri","primavera 1265","14-09-1321","poeta e scrittore italiano"];
r3=["Dante Alighieri","maggio-giugno 1265","settembre 1321","poeta italiano"];
r4=["Dante Alighieri","1265","1321-09-14",""];

// caricamento
$.each(r1, function(indice,valore) {$(".riga"+(indice+1)+" .colonna2").html(valore);});
$.each(r2, function(indice,valore) {$(".riga"+(indice+1)+" .colonna3").html(valore);});
$.each(r3, function(indice,valore) {$(".riga"+(indice+1)+" .colonna4").html(valore);});

// attivazione

$(".colonna1").append($("<textarea col='30' row='2' />"));
$("td:not(.colonna1)",$(".tabella")).click(function () {
   $(this).siblings("td:not(.colonna1)").css("background-color","white"); 
   $(this).css("background-color","yellow");
   $("textarea",$(this).parent()).val($(this).text());
});

function delShow() {$("#showCode").remove();}
Passo 2
trasformazione in funzione
// dati in ingresso
r1=["Dante Alighieri","1265","14 settembre 1321","poeta, scrittore e politico italiano"];
r2=["Durante di Alighiero degli Alighieri","primavera 1265","14-09-1321","poeta e scrittore italiano"];
r3=["Dante Alighieri","maggio-giugno 1265","settembre 1321","poeta italiano"];
r4=["Dante Alighieri","1265","1321-09-14",""];
r=[r1,r2,r3,r4];

function activeTab(r) {
// creazione box
$('<div ondblclick="delShow()" style="line-height:1em; background-color:#FCFCFC; font-family:Courier; font-size:0.8pc; position:absolute; width:100%; height:100%; top:0px; right:0px; z-index:999; border:1px solid #bbb;" id="showCode"></div>').appendTo($("#mw-content-text")); 

// creazione tabella
$("#showCode").append($('<table class="tabella" border="1" cellspacing="0" cellpadding="2" width="100%" ></table'));

// aggiunta righe 1-5
for (var i=1;i<r.length+1;i+=1) {html='<tr class="riga'+i+'"></tr>';$(".tabella").append($(html)); }

// aggiunta colonne 1-4
$("tr",$(".tabella")).each(function() {for (var i=1;i<r[0].length+2;i+=1) {var classe=$(this).attr("class"); var html='<td class="'+classe+' '+'colonna'+i+'"> </td>';$(this).append($(html)); }})

// caricamento
//for (var i=0; i<r.length; i+=1) {$.each(r[i+1], function(indice,valore) 
//{$(".riga"+(indice+1)+" .colonna"+(i+2)).html(valore);});}
for (var i=0; i<r.length; i+=1) {
    for (var j=0; j<r[0].length; j+=1) {
       $(".riga"+(j+1)+" .colonna"+(i+2)).html(r[i][j]);
    }
    
}


// attivazione

$(".colonna1").append($("<textarea col='30' row='2' />"));
$("td:not(.colonna1)",$(".tabella")).click(function () {
   $(this).siblings("td:not(.colonna1)").css("background-color","white"); 
   $(this).css("background-color","yellow");
   $("textarea",$(this).parent()).val($(this).text());
});
for (i=1;i<r.length+1;i+=1) {$(".riga"+i+" textarea").val($(".riga"+i+" .colonna2").text())
}
}