Ciao a tutti
Premetto che non sono un'esperto di DOM.
Immaginate la situazione di avere speso 2 mesi di tempo per creare un'applicazione per poi accorgermi che le istruzioni DOM eseguite da Internet Explorer sono circa 10 volte più lente rispetto a Firefox (10 secondi contro 1,5 cronometrati).
E' il mio caso.
Vorrei un'aiuto per cercare di risolvere il problema senza stravolgere il codice e la logica dell'applicazione.
Il problema in parole povere è questo:
da una select, alla onchange eseguo una funzione javascript che utilizza istruzioni DOM.
Purtroppo la onchange è abbastanza frequente e percio l'utente stà in attesa 10 secondi ogni volta che cambia un valore.
La funzione Javascript si chiama: DOSELMACH ed esegue alla fine la funzione RICALCOLA.
Richiamata dalla onchange dalla select: SELMACH
Allego il codice.
Tenete presente che le righe nella tabella a video sono 52.
Ne allego solo alcune per esempio.
GRAZIE A TUTTI IN ANTICIPO.
PS:
non riesco ad allegare il documento completo html che ho su disco.
<html>
<head>
<title>Piano di produzione Assemblaggio. Programma WMAG46</title>
<link href="/cgiexe/css/as400.css" rel="stylesheet" type="text/css">
<style TYPE="text/css">
thead {display: table-header-group;}
tfoot {display: table-footer-group;}
</style>
<style media="print">
.noprint { display: none }
</style>
<script language="Javascript" src="/cgiexe/jscripts/scw.js" type="text/javascript">
</script>
<script language="Javascript" src="/cgiexe/jscripts/handleEnter.js" type="text/javascript">
</script>
<script language=javascript>
//================================================== =================
// E' variata la Macchina nella select della testata e di conseguenza:
// - rileggo tutte le righe del subfile
// - su tutte le righe della vecchia macchina forzo readonly su tutti i campi di I/O
// - su tutte le righe della vecchia macchina forzo il colore di backgr. verde
//================================================== =================
function doselmach() {
document.form1.totpezzimach.value=0
document.form1.oreocc.value=0
document.form1.orelibere.value=document.form1.ored ispon.value
//trovo la produttivitÓ della Macchina dalla opzione selezionata della Select delle macchine
//e aggiorno il campo pezzi turno effettivi
var x=document.getElementById("IdSelMach")
var text=x.options[x.selectedIndex].text
var pos=text.indexOf("Pz/Turno:")
if (pos==-1) {
document.form1.pezzieff.value=0
} else {
var pezzieff=text.substring(pos+9)
document.form1.pezzieff.value=text.substring(pos+9 )
}
//mi posiziono sul campo della data inizio macchina, in modo che l'utonto non possa scorrere per sbaglio
//la select delle Macchine che genera lentezza con IE
document.form1.datainimach.focus()
//document.form1.datainimach.select()
for (k=0; k<1000; k++) {
if (document.form1.sel[k]==undefined) {return false}
if ((document.form1.selmach.value!=document.form1.mac h[k].value) && (document.form1.mach[k].value!="")) {
document.getElementById("pezzi"+k).readOnly=true
document.getElementById("seq"+k).readOnly=true
document.getElementById('seq'+k).style.background= "#00FF7F" //verde
document.getElementById("prta"+k).readOnly=true
document.getElementById("comme"+k).readOnly=true
document.getElementById('macch'+k).style.backgroun d="#00FF7F" //verde
document.getElementById('macch'+k).style.font="bol d 12px arial,serif"
document.getElementById('macch'+k).style.border="0 none #ffffff"
}
if ((document.form1.selmach.value==document.form1.mac h[k].value) && (document.form1.mach[k].value!="")) {
document.getElementById("pezzi"+k).readOnly=false
document.getElementById("seq"+k).readOnly=false
document.getElementById('seq'+k).style.background= "#faf890" //giallo
document.getElementById("prta"+k).readOnly=false
document.getElementById('macch'+k).style.backgroun d="#FFE303" //giallo
document.getElementById('macch'+k).style.font="bol d 12px arial,serif"
document.getElementById('macch'+k).style.border="0 none #ffffff"
document.getElementById("comme"+k).readOnly=false
}
//ricalcolo tutto dopo avere cambiato la Macchina
Ricalcola()
}
}
//================================================== =================
// Questa funzione viene richiamata:
// alla ONCHANGE del campo PEZZI del subfile ad ogni riga del subfile
// alla ONBLUR del campo Pezzi turno effettivi
//
// Lo scopo Þ quello di aggiornare al volo tutti i campi di totale a video dopo una modifica.
//================================================== =================
function Ricalcola() {
//-----------------------------------------------------------------------------------------
// Ricalcolo e Aggiorno i GG di differenza tra la data inizio della Macchina scelta e la
// data fine inserita in testata
//-----------------------------------------------------------------------------------------
// creo l'array della data inizio Macchina con 3 elementi: anno/mese/giorno
var entry1 = document.form1.datainimach.value.split('/');//splits input value;
y1=entry1[2]*1
m1=entry1[1]*1-1;//sets months to default values i.e Jan = 0; Feb = 1; etc.
d1=entry1[0]*1
// creo l'array della data finale di programmazione con 3 elementi: anno/mese/giorno
var entry2 = document.form1.datafinprog.value.split('/');//splits input value;
y2=entry2[2]*1
m2=entry2[1]*1-1;//sets months to default values i.e Jan = 0; Feb = 1; etc.
d2=entry2[0]*1
//creo i campi data
var data1 = new Date(y1,m1,d1);
var data2 = new Date(y2,m2,d2);//sets the new date
if (data1>data2) {
alert("La Data iniziale di Programmazione e' maggiore della Data finale")
document.form1.datainimach.focus()
document.form1.datainimach.select()
return
}
//calcolo la differenza in millisecondi tra data finale (piu' alta) e iniziale (piu' bassa)
dif = data2-data1
// Math.ceil() - arrotonda un numero (per eccesso) all'intero successivo (es: 0.5 = 1)
dif = Math.ceil(dif/1000/60/60/24) //differenza in giorni
//----------------------------------------------------
// Ricalcolo e Aggiorno le ore Macchina disponibili
//----------------------------------------------------
document.form1.oredispon.value=dif*24
//------------------------------------------------------
// Ricalcolo e Aggiorno:
// 1) il N‹ totale pezzi inseriti dall'utente
// 2) il N‹ totale pezzi riferito alla macchina scelta
// 2) le ore macchina occupate
// 3) le ore macchina libere
//------------------------------------------------------
var totpezziass=0
var totpezzimach=0
var oreocc=0
//Calcolo:
//Il totale pezzi (TOTPEZZIASS) e il totale Pezzi relativo alla Macchina scelta (TOTPEZZIMACH)
//In realtÓ qui i totali li faccio sempre, anche se la checkbox non Þ segnata, altrimenti
//se l'utente togliesse la spunta, non farei il ricalcolo corretto.
//I totali sono 2 perchÞ:
//TOTPEZZIASS Þ il totale generale in fondo
//TOTPEZZIMACH Þ il totale pezzi assegnato alla macchina scelta, per fare il conteggio delle ore Occupate/Libere
if (document.form1.nbrrecs.value>1) {
for (m=0; m<1000; m++) {
if (document.form1.sel[m]==undefined) {break}
var totpezziass=totpezziass+document.form1.pezzi[m].value*1
if ((document.form1.selmach.value!="")) {
if (document.form1.selmach.value==document.form1.mach[m].value) {
totpezzimach=totpezzimach+document.form1.pezzi[m].value*1
}
}
}
}
if (document.form1.nbrrecs.value==1) {
if ((document.form1.selmach.value!="")) {
var totpezziass=totpezziass+document.form1.pezzi.value *1
totpezzimach=totpezzimach+document.form1.pezzi.val ue*1
}
}
//aggiorno il Tot.Pezzi, ore macchina occupate e ore macchina libere
document.form1.totpezzimach.value=totpezzimach
document.form1.totpezziass.value=totpezziass
if ((document.form1.pezzieff.value!="0") && (document.form1.pezzieff.value!="")) {
document.form1.oreocc.value=Math.round((totpezzima ch/document.form1.pezzieff.value*1)*8)
document.form1.orelibere.value=document.form1.ored ispon.value*1-document.form1.oreocc.value*1
//se le ore libere solo <0 lo sfondo diventa rosso. Diversamente Þ giallo.
if (document.form1.orelibere.value<0) {
document.getElementById('orelibere').style.backgro und="#FF030D" //rosso
document.getElementById('orelibere').style.font="b old 12px arial,serif"
document.getElementById('orelibere').style.border= "2 solid black"
} else {
document.getElementById('orelibere').style.backgro und="#FFE303" //giallo
document.getElementById('orelibere').style.font="b old 12px arial,serif"
document.getElementById('orelibere').style.border= "2 solid black"
}
}
//fine function
}
</script>
</head>
Macchina
<select class=iform name=selmach size=1 onChange=doselmach() id="IdSelMach" onkeypress="return handleEnter(this, event)">
<option value="">
</option>
<option value="M327">M327ASS.TS1 4ª PARTE GEFIT VEL (1)Pz/Turno:23000
</option>
<option value="M328">M328ASS.TS1 4ª PARTE GEFIT VEL (2)Pz/Turno:23000
</option>
<option value="M330">M330ASS.TS1 4ª PARTE BETT. TERMOLIPz/Turno:35000
</option>
<option value="M346">M346ASS.4 PARTE TRPz/Turno:10000
</option>
</select>
<table cellpadding=2 cellspacing=0 border=5>
<thead>
<tr>
<td class=small9px valign=top>Cliente</td>
<td class=small9px valign=top>Vincolo</td>
<td class=small9px valign=top>Ordine</td>
<td class=small9px valign=top>St</td>
<td class=small9px valign=top>Set</td>
<td class=small9px valign=top>Data Sped</td>
<td class=small9px valign=top>Codice articolo</td>
<td class=small9px valign=top>in Ordine</td>
<td class=small9px valign=top>da Produrre</td>
<td class=small9px valign=top>Macchina</td>
<td class=small9px valign=top>Seq</td>
<td class=small9px valign=top>Pezzi</td>
<td class=small9px valign=top>Pta'</td>
<td class=small9px valign=top>Bolla Nicim</td>
<td class=small9px valign=top>Sel</td>
<td class=small9px valign=top>Commento per i capiturno</td>
</tr>
</thead>
<tr>
<td class=small9px align=left nowrap>190770BARTOLINE LIMITED-GB</td>
<td class=small9px align=left nowrap>CRC-CERE-ON/OFF-DOWLEX</td>
<td class=small9px align=left nowrap>115978/1</td>
<td class=small9px align=left nowrap>Firm</td>
<td class=small9px align=left nowrap><font color=black>35</font></td>
<td class=small9px align=left nowrap>VEN 31/08/2007*</td>
<td class=small9px align=left nowrap>80A-RB0B0-1705</td>
<td class=small9px align=right nowrap>36.000</td>
<td class=small9px align=right nowrap><font color=red>9.000</td>
<input type=hidden name=pezzidapro value=9000>
<td class=small9px><input type=text name=mach size=4 maxlength=4 readonly id='macch0' class=readonlybianco11px value=M330></td>
<td class=small9px><input type=text name=seq size=3 maxlength=3 id='seq0' onBlur=checkdupseq("1") tabindex="1" value=1></td>
<td class=small9px><input type=text name=pezzi size=6 maxlength=6 id='pezzi0' onChange=Ricalcola() tabindex="2" value=9000></td>
<td class=small9px><input type=text name=prta size=1 maxlength=1 id='prta0' tabindex="3" value=1></td>
<td class=small9px><input type=text name=rifni size=7 maxlength=6 readonly class="readonly" tabindex="4" value=></td>
<td class=small9px><input type=checkbox name=sel onClick=dosel("1") value="1" checked></td>
<td class=small9px><input type=text name=comme size=40 maxlength=40 id='comme0' class=iform11white
tabindex="5" value=""></td>
<input type=hidden name=spprog value=66258>
<input type=hidden name=nriga value=1>
<input type=hidden name=mach_nicim value="">
<input type=hidden name=seq_nicim value="">
<input type=hidden name=pezzi_nicim value="">
<input type=hidden name=prta_nicim value="">
<input type=hidden name=rif_nicim value="">
</tr>
</table>
</form>