Sujet Précédent Sujet Suivant

[IE] Trop de JS tue le JS ?

xactise Messages postés 507 Date d'inscription mardi 18 février 2003 Statut Membre Dernière intervention 22 juin 2012 - 30 nov. 2009 à 09:18
Bul3 Messages postés 4933 Date d'inscription samedi 1 juillet 2006 Statut Membre Dernière intervention 2 février 2015 - 30 nov. 2009 à 15:30
Bonjour à tous,

J'ai un petit souci avec Internet Explorer (V8, donc pas tester les précédentes, je me doute que le résultat sera le même.)

J'ai une page qui est assez gourmande en JS du fait que je génère des tableau (ma fois complet) en DOM.

Mes fonctions me semble pourtant bien fait niquel.

Le soucis est que tous passe niquel sous FireFox, mais sous IE sa passe dison 1 fois sur 10. Ma page ne se charge pas complêtement, le plus étrange c'est que le chargement de la page s'arrête à différents endroit. et parfois ben sa passe au complet...

Très étrange, je tiens a signaler que le script s'arrête tous le temps après les appels a mes différentes fonction, et que ces dernière fonctionne très bien, c'est juste que sa ne se charge pas jusqu'au bout parfois un peu plus, parfois au complet...

Quelqu'un a une idée ?

D'avance merci


L0rD...

4 réponses

Réponse 1 / 4
Bul3 Messages postés 4933 Date d'inscription samedi 1 juillet 2006 Statut Membre Dernière intervention 2 février 2015 16
30 nov. 2009 à 09:39
Bonjour,
bah.... sans le moindre ch'tiot bout de code,
difficile d'avancer une quelconque hypothèse
temps trop long... mais là, IE le dit.
pas de raisons, à priori, sauf erreurs dues
aux différences IE,Fx ?
debogage ?

Cordialement [mon Site] [M'écrire] Bul
0
Réponse 2 / 4
xactise Messages postés 507 Date d'inscription mardi 18 février 2003 Statut Membre Dernière intervention 22 juin 2012 2
30 nov. 2009 à 10:09
Yop merci pour ta réponse et ta rapidité,

Disons que j'ai pas mal de petite fonction pour généré du DOM

Du style : 

function DOMaddTR(id){
var tr = document.createElement("tr");
tr.setAttribute("id", id);

return tr;
}

function DOMaddTD(id, classs, width, align, colspan, rowspan){
var td = document.createElement("td");
td.setAttribute("id", id);
td.setAttribute("class", classs);
td.setAttribute("width", width);
td.setAttribute("align", align);
td.setAttribute("colspan", colspan);
td.setAttribute("rowspan", rowspan);

return td;
}

function DOMaddINPUT(name, id, classs, readonly){
var input = document.createElement("input");
input.setAttribute("name", name);
input.setAttribute("id", id);
input.setAttribute("class", classs);
if(readonly==true) input.setAttribute("readonly","readonly");

return input;
}



function getElementsByName2 (obj, name) {
var elements = document.getElementsByName(name);
var resultat = new Array();

for (i=0; i<elements.length; i++) {
if (isChildOf(elements[i], obj)) {
resultat.push(elements[i]);
}
}

return resultat;
}
function isChildOf (obj, parent) {
var child = obj;
while (typeof (child = child.parentNode) != "undefined" && child != null) {
if (child == parent) {
return true;
}
}
return false;
}

function check_formations()
{
var count = getNAME("f_type_formation[]").length;
for(var i=0;i<count;i++)
{
if(getNAME("f_vendeur[]")[i].value=="choisir")
{
alert("Veuillez sélectionner le vendeur de la formation");
return false;
}
}
return true;
}

etc....

et Une assez grande fonction 

function DOMaddRow(type_formation,i, id_formation, vendeur, prix_formation, participant, cheque_virement_recu, paiement, date_facturation, date_paiement, date_formation, formateur, convention_signe, attestation_presence, formation_annule, modifier){


var id_formation id_formation undefined ? '' : id_formation;
var vendeur vendeur undefined ? '' : vendeur;
var prix_formation prix_formation undefined ? '' : prix_formation;
var participant participant undefined ? '' : participant;
var cheque_virement_recu cheque_virement_recu undefined ? '' : cheque_virement_recu;
var paiement paiement undefined ? '' : paiement;
var date_facturation date_facturation undefined ? '' : date_facturation;
var date_paiement date_paiement undefined ? '' : date_paiement;
var date_formation date_formation undefined ? '' : date_formation;
var formateur formateur undefined ? '' : formateur;
var convention_signe convention_signe undefined ? '' : convention_signe;
var attestation_presence attestation_presence undefined ? '' : attestation_presence;
var formation_annule formation_annule undefined ? '' : formation_annule;
var modifier modifier undefined ? false : modifier;


div = getID('listing_formation_'+type_formation);

var tableau = document.createElement("table");
tableau.setAttribute("id", type_formation+"_"+i);
tableau.setAttribute("class", "table");
tableau.setAttribute("cellpadding", "5");
tableau.setAttribute("cellspacing", "0");


var table = document.createElement("tbody");

var tr = DOMaddTR('');
var td = DOMaddTD('','fond_menu gras centrer','','center','2','');
var input = DOMaddINPUT("f_type_formation[]", "f_type_formation"+type_formation+"_"+i, "invisible_", false);
input.setAttribute("value", type_formation);
td.appendChild(input);
var input = DOMaddINPUT("f_id_formation[]", "f_id_formation"+type_formation+"_"+i, "invisible_", false);
input.setAttribute("value", id_formation);
td.appendChild(input);
td.innerHTML += 'Formation '+type_formation+' '+i;


tr.appendChild(td);
table.appendChild(tr);

tr = DOMaddTR('');
td = DOMaddTD('','gras','','','1','');
td.innerHTML = 'Vendeur : ';
td2 = DOMaddTD('','','','','1','');

td2.innerHTML = "<?=liste_all("f_vendeur[]","",false);?>";

tr.appendChild(td);
tr.appendChild(td2);
table.appendChild(tr);

tr = DOMaddTR('');
td = DOMaddTD('','gras','','','1','');
td.innerHTML = 'Prix : ';
td2 = DOMaddTD('','','','','1','');
input = DOMaddINPUT("f_prix[]","f_prix_"+type_formation+"_"+i,"input50",false);

if(modifier==true)
input.setAttribute('value',prix_formation);



td2.appendChild(input);
td2.innerHTML += " &euro";

tr.appendChild(td);
tr.appendChild(td2);
table.appendChild(tr);



tr = DOMaddTR('');
td = DOMaddTD('','gras','','','1','');
td.innerHTML = 'Participant : ';
td2 = DOMaddTD('','','','','1','');
input = DOMaddINPUT("f_participant[]","f_participant"+type_formation+"_"+i,"input50",false);

if(modifier==true)
input.setAttribute('value',participant);



td2.appendChild(input);		
tr.appendChild(td);
tr.appendChild(td2);
table.appendChild(tr);


tr = DOMaddTR('');
td = DOMaddTD('','gras','','','1','');
td.innerHTML = 'Chèque / Virement reçu : ';
td2 = DOMaddTD('','','','','1','');
td2.innerHTML = '<select name="f_cheque_virement_recu[]" id="cheque_virement_recu_'+type_formation+'_'+i+'"><option value="" '+(cheque_virement_recu=='' ? 'selected="selected"' : '')+'>----</option><option value="Non" '+(cheque_virement_recu=='Non' ? 'selected="selected"' : '')+'>Non</option><option value="Oui" '+(cheque_virement_recu=='Oui' ? 'selected="selected"' : '')+'>Oui</option></select>';

tr.appendChild(td);
tr.appendChild(td2);
table.appendChild(tr);



tr = DOMaddTR('');
td = DOMaddTD('','gras','','','1','');
td.innerHTML = 'Paiement : ';
td2 = DOMaddTD('','','','','1','');
td2.innerHTML = '<select name="f_paiement[]" id="f_paiement_'+type_formation+'_'+i+'"><option value="" '+(paiement=='' ? 'selected="selected"' : '')+'>------</option><option value="Non" '+(paiement=='Non' ? 'selected="selected"' : '')+'>Non</option><option value="Oui" '+(paiement=='Oui' ? 'selected="selected"' : '')+'>Oui</option><option value="Offert" '+(paiement=='Offert' ? 'selected="selected"' : '')+'>Offert</option></select>';

tr.appendChild(td);
tr.appendChild(td2);
table.appendChild(tr);



tr = DOMaddTR('');
td = DOMaddTD('','gras','','','1','');
td.innerHTML = 'Date facturation : ';
td2 = DOMaddTD('','','','','1','');
input = DOMaddINPUT("f_date_facturation[]", "date_facturation_"+type_formation+"_"+i, "", false);

if(modifier==true)
input.setAttribute('value',date_facturation);

td2.appendChild(input);
td2.innerHTML += "remettre à zéro";
tr.appendChild(td);
tr.appendChild(td2);
table.appendChild(tr);



tr = DOMaddTR('');
td = DOMaddTD('','gras','','','1','');
td.innerHTML = 'Date paiement : ';
td2 = DOMaddTD('','','','','1','');
input = DOMaddINPUT("f_date_paiement[]", "date_paiement_"+type_formation+"_"+i, "", false);

if(modifier==true)
input.setAttribute('value',date_paiement);

td2.appendChild(input);
td2.innerHTML += "remettre à zéro";
tr.appendChild(td);
tr.appendChild(td2);
table.appendChild(tr);



tr = DOMaddTR('');
td = DOMaddTD('','gras','','','1','');
td.innerHTML = 'Date formation : ';
td2 = DOMaddTD('','','','','1','');
input = DOMaddINPUT("f_date_formation[]", "date_formation_"+type_formation+"_"+i, "", false);

if(modifier==true)
input.setAttribute('value',date_formation);

td2.appendChild(input);
td2.innerHTML += "remettre à zéro";
tr.appendChild(td);
tr.appendChild(td2);
table.appendChild(tr);

tr = DOMaddTR('');
td = DOMaddTD('','gras','','','1','');
td.innerHTML = 'Formateur : ';
td2 = DOMaddTD('','','','','1','');
td2.innerHTML = "<?=liste_all("f_formateur[]","",false);?>";

tr.appendChild(td);
tr.appendChild(td2);
table.appendChild(tr);

tr = DOMaddTR('');
td = DOMaddTD('','gras','','','1','');
td.innerHTML = 'Convention sign&eacute: : ';
td2 = DOMaddTD('','','','','1','');
td2.innerHTML = '<select name="f_convention_signe[]" id="convention_signe_'+type_formation+'_'+i+'"><option value="" '+(convention_signe=='' ? 'selected="selected"' : '')+'>----</option><option value="Non" '+(convention_signe=='Non' ? 'selected="selected"' : '')+'>Non</option><option value="Oui" '+(convention_signe=='Oui' ? 'selected="selected"' : '')+'>Oui</option></select>';

tr.appendChild(td);
tr.appendChild(td2);
table.appendChild(tr);



tr = DOMaddTR('');
td = DOMaddTD('','gras','','','1','');
td.innerHTML = 'Attestation de présence : ';
td2 = DOMaddTD('','','','','1','');
td2.innerHTML = '<select name="f_attestation_presence[]" id="attestation_presence_'+type_formation+'_'+i+'"><option value="" '+(attestation_presence=='' ? 'selected="selected"' : '')+'>----</option><option value="Non" '+(attestation_presence=='Non' ? 'selected="selected"' : '')+'>Non</option><option value="Oui" '+(attestation_presence=='Oui' ? 'selected="selected"' : '')+'>Oui</option></select>';

tr.appendChild(td);
tr.appendChild(td2);
table.appendChild(tr);



tr = DOMaddTR('');
td = DOMaddTD('','gras','','','1','');
td.innerHTML = 'Annulée : ';
td2 = DOMaddTD('','','','','1','');
td2.innerHTML = '<select name="f_formation_annule[]" id="formation_annule_'+type_formation+'_'+i+'"><option value="" '+(formation_annule=='' ? 'selected="selected"' : '')+'>----</option><option value="Non" '+(formation_annule=='Non' ? 'selected="selected"' : '')+'>Non</option><option value="Oui" '+(formation_annule=='Oui' ? 'selected="selected"' : '')+'>Oui</option></select>';

tr.appendChild(td);
tr.appendChild(td2);
table.appendChild(tr);

tableau.appendChild(table);
div.appendChild(tableau);

getID('count_'+type_formation).innerHTML = i;

if(modifier==true)
if(prix_formation!='') getID('count_modif_'+type_formation).innerHTML = i;


var nb_select = getElementsByName2(getID("listing_formation_"+type_formation),"f_vendeur[]")[parseInt(i)-1].length;
for(var j=0;j<nb_select;j++)
{
if(getElementsByName2(getID("listing_formation_"+type_formation),"f_vendeur[]")[parseInt(i)-1].options[j].value==vendeur)
getElementsByName2(getID("listing_formation_"+type_formation),"f_vendeur[]")[parseInt(i)-1].options[j].selected = true;

}


var nb_select = getElementsByName2(getID("listing_formation_"+type_formation),"f_formateur[]")[parseInt(i)-1].length;
for(var j=0;j<nb_select;j++)
{
if(getElementsByName2(getID("listing_formation_"+type_formation),"f_formateur[]")[parseInt(i)-1].options[j].value==formateur)
getElementsByName2(getID("listing_formation_"+type_formation),"f_formateur[]")[parseInt(i)-1].options[j].selected = true;

}
}



Voila c'est assez long et lourd, je pense pas qu'il y est d'erreur comme je t'es dit car des moments la page ce charge en entier, et mes scripts fonctionnent bien...

D'avance merci

L0rD...
0
Réponse 3 / 4
Bul3 Messages postés 4933 Date d'inscription samedi 1 juillet 2006 Statut Membre Dernière intervention 2 février 2015 16
30 nov. 2009 à 10:30
° déjà, je n'utilise "jamais" setAttribute
il y a des différences entre navigateurs
par exemple à 
var tableau = document.createElement("table");
tableau.setAttribute("id", type_formation+"_"+i);
tableau.setAttribute("class", "table");
tableau.setAttribute("cellpadding", "5");
tableau.setAttribute("cellspacing", "0");
je préfère ( tout simplement ) 
var tableau = document.createElement("table");
tableau.id=type_formation+"_"+i;
tableau.className="table";
tableau.cellpadding="5";
tableau.cellspacing= "0";

° ensuite, innerHTML+= peut ralentir énormément
createElement + appendChild valent mieux (?)
comme vous utilisez déjà...
° pas sur que les fonctions getElementsByName2+ isChildOf
soient réellement nécessaires. si c'est uniquement
pour retrouver les éléments contenus dans un autre.
° pas tout regardé à fond

ça n'explique peut-être rien du tout ? mais
je tenterais déjà ça...
0
Réponse 4 / 4
Bul3 Messages postés 4933 Date d'inscription samedi 1 juillet 2006 Statut Membre Dernière intervention 2 février 2015 16
30 nov. 2009 à 15:30
c'est vrai que j'ai oublié un piste, un exemple...
pour voir les "éléments contenus dans un autre"
si j'ai compris ce à quoi ça servait !
regardez élément.getElementsByTagName("*")
( et test du className si nécessaire )
si cela ne correspond pas, c'est parce que
je n'ai pas pigé, le but, mais ce doit être
aussi simple que ça, voire plus
0

Discussions similaires

Partie entiére d'un nombre
stephbb75 -
stephbb75 -

2 réponses
sweetAlert
ckrisL -
ckrisL -

15 réponses
Récupérer toutes les class d'un élément
cs_flexx -
flexx -

2 réponses
Incrémentation d'une variable globale en javascript
forcels -
forcels -

4 réponses
condition PHP => fonction JS
xactise -
pcgpegase -

1 réponse
Rejoignez-nous