"Done with Errors'' sur IE mais pas sur FF

**billyrose** · 09/07/2009, 10h58

Bonjour a tous,

j'ai un petit module qui me permet de creer une ligne dans une table. je cree les lignes dynamiquement avec JS. et ensuite quand je soumets le formulaire, je reaffiche ces lignes grace a PHP.

mon code JS qui me permet de creer des lignes:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
var bUniqueRowID = 0;
function getXhr(){
    var xhr = null; 
	if(window.XMLHttpRequest) // Firefox and others
		xhr = new XMLHttpRequest(); 
	else if(window.ActiveXObject){ // Internet Explorer 
	   try {
			xhr = new ActiveXObject("Msxml2.XMLHTTP");
			} catch (e) {
				xhr = new ActiveXObject("Microsoft.XMLHTTP");
			}
	}
	else { // XMLHttpRequest not supported by your browser
		alert(" Your browser does not support XMLHTTPRequest objects..."); 
		xhr = false; 
		} 
     return xhr
	}
 
	/**
	*  method called when the user clicks on the button
	*/
 
function gobr(){
	var xhr = getXhr()
	// We defined what we gonna do with the response
	xhr.onreadystatechange = function(){
	// We do somthing once the server's response is OK
	if(xhr.readyState == 4 && xhr.status == 200){
 
 
			// Retrieve <table> ID and create a <tbody> element
 
			// Retrieve <table> ID and create a <tbody> element
 
			var tbl = document.getElementById("brtable");
			var tblBody = document.createElement("tbody");
			var row = document.createElement("tr");
 
			bUniqueRowID += 1;
 
			var cell_1 = document.createElement("td");
			cell_1.align="center";
			cell_1.valign="center";
			var cell_2 = document.createElement("td");
			cell_2.align="center";
			cell_2.valign="center";
			var cell_3 = document.createElement("td");
			cell_3.align="center";
			cell_3.valign="center";
 
 
		// Create the first cell which is a select
 
			var cell1 = document.createElement("div");
			cell1.innerHTML=xhr.responseText;
			cell_1.appendChild(cell1);		
 
		//Create the second cell a checked box
			var cell2=document.createElement("input");
			cell2.type="checkbox";
			cell2.name="brdedicated";
			cell_2.appendChild(cell2);
 
		// Create the third cell which is a button
			var cell3=document.createElement("input");
			cell3.type="button";
			cell3.value="Delete"
			cell3.onclick=delRowbr;
			cell_3.appendChild(cell3);						
 
			// add cells to the row
			row.appendChild(cell_1);
			row.appendChild(cell_2);
			row.appendChild(cell_3);
 
		// add the row to the end of the table body
			tblBody.appendChild(row);
 
		// put the <tbody> in the <table>
			tbl.appendChild(tblBody);
 
		//	Rename cells with the row index			
			var ind=row.rowIndex;
			var liste_bname = row.getElementsByTagName("input");
			var selectname = row.getElementsByTagName("select");
 
			if (ind == 1){
 
				for(i=0; i < liste_bname.length; i++){
					if (/*(liste_bname[i].name == "brule")|| */ (liste_bname[i].name == "brdedicated")){
					liste_bname[i].name = liste_bname[i].name + "_" + ind; //give brule_1, brule_2...
					}
				}
				selectname[0].name = selectname[0].name + "_" + ind;
			}
			else if ((bUniqueRowID == ind) && (ind !=1)){
 
				for(i=0; i < liste_bname.length; i++){
					if (/*(liste_bname[i].name == "brule") || */(liste_bname[i].name == "brdedicated")){
					liste_bname[i].name = liste_bname[i].name + "_" + ind; //give brule_1, brule_2...
					}
				}
				selectname[0].name = selectname[0].name + "_" + ind;
			}	
			else {
				ind = bUniqueRowID;
 
				for(i=0; i < liste_bname.length; i++){
					if (/*(liste_bname[i].name == "brule") ||*/ (liste_bname[i].name == "brdedicated")){
					liste_bname[i].name = liste_bname[i].name + "_" + ind; //give brule_1, brule_2...
					}
				}
				selectname[0].name = selectname[0].name + "_" + ind;
			}
			//alert(cell2.name);
			alert(ind);														
		// sets the border attribute of tbl to 1;
			tbl.setAttribute("border", "2");
 
		}
	}
	xhr.open("GET","brded.php?dt=" + new Date().getTime(),true);
	xhr.send(null);
}	
var mywindowqm = null;
function createbr(){
    if(mywindowqm != null && mywindowqm.closed == false) {
        alert("The window is already open");
    }
    else  {
        mywindowqm = window.open("create_br.php","PopUp", "width=1000,height=1000,left=" + ((screen.width - 1000)/2) + ",top=" + ((screen.height - 1000)/2) + "location=yes,status=yes,toolbar=no,scrollbars=yes resizable=yes");
 
    }
}		
 
function delRowbr(unNom){
  var monObjet = this; 
  if(unNom != null) {
       monObjet = unNom;
  }
  var i= monObjet.parentNode.parentNode.rowIndex;
  document.getElementById('brtable').deleteRow(i);
}
 
 
function update_globale_br(){
   //récupération du numéro
	var rows=document.getElementById("brtable").rows;
	var lr=rows[(rows.length)-1];
	var lf = lr.getElementsByTagName("select");
	var spl=lf[0].name.split('_');
	var numero = spl[1];
	numero++
	bUniqueRowID = numero;
}

Ensuite le reaffcihage des lignes est:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <script language="javascript" src="busrul.js">
 
</script>
 
</head>
<?php print_r($_POST); 
function usebronce($table, $b){
        $op=explode("_", $b);
        foreach ($table as $key => $i){
                $op1=array();
                $op1=explode("_", $key);
                if ($op1[0] == 'brule'){
                        if ($op[1] != $op1[1]) {
                                if ($table['brule_'.$op[1]] == $table['brule_'.$op1[1]]) {
                                        $a[]= 'There are some business rules that have been used twice or more. Please review your table.';
                                } else {
                                        $a[]=1;
                                }
                        } else {
                                $a[]=0;
                        }
                }
        }
        return $a;
}
?>
<?php
	if (isset($_POST['submit'])) {
	require_once ('../mysqli_connect.php');
	$table=array_map('trim', $_POST);
	$errors=array();
	$result = array();
	foreach ($table as $key => $i){
		$output=array();
		$output=explode("_", $key);
		if ($output[0] == 'brule') {
			$result[]=$output[1];
		}
	}
	echo '<form method="POST" action="br.php">';
	print_r($result);
 
	echo '<table align="center" border = "2" cellspacing ="0" cellpadding="3" id="brtable">
		<tr>
			<td><b>Business Rule Type:</b></td>
			<td><b>Dedicated:</b></td>
			<td><input type="button" Name= "Ajouterbr" Value="ADD BR" onclick="gobr()"></td>
	</tr>';
 
	foreach ($result as $j) {
		$br='brule_' . $j;
		$brd='brdedicated_' . $j;
 
		echo'<tr>';
		echo '<td align="center" valign="center"><select name="' . $br. '" style="width: 100px">';		
		$q = "SELECT br.Biz_rule_ID, br.Biz_rule_code FROM business_rules AS br WHERE br.Biz_rule_ID NOT IN ( SELECT bri.Biz_rule_ID FROM biz_rule_items AS bri where bri.BR_dedicated=1)";
		$r = mysqli_query($dbc, $q);
		if (mysqli_num_rows($r) > 0) {
			while ($menu_row = mysqli_fetch_array($r, MYSQLI_NUM)) {
				$selected = (isset($table[$br]) and $table[$br] == $menu_row[0])?'selected="selected"':'';
				echo '<option value="' .$menu_row[0]. '" '.$selected.'> ' . $menu_row[1] . '</option>\n';
			}
		}
		echo '</select></td>';
		mysqli_free_result($r);
		unset($menu_row);
 
		echo '<td align="center" valign="center"><input type="checkbox" name="' . $brd . '"';
		if (isset($table[$brd])){
			echo 'checked="' .$table[$brd]. '"></td>';
		}
		else
			echo '></td>';
		echo '<td align="center" valign="center"><input type="button"  value="Delete" onclick="delRowbr(this)"></td>';
		echo '</tr>';
	}
	echo '</table>';
	echo '<p><input type="submit" name="submit" value="Enter"></p>';
	echo '</form>';
	echo '<script>update_globale_br()</script>';
 
	foreach ($result as $k) {
		$brk='brule_' . $k;
		$err=usebronce($table, $brk);
		$errors=array_merge($errors, $err);
	}
	//print_r($errors);
 
	foreach($errors as $key => $i){
 
		if ((strnatcmp($i,1) ==0) or (strnatcmp($i,0)==0)){
			unset($errors[$key]);
		}
	}
	print_r($errors);
 
}
 
else {
?>
 
<form method="POST" action="br.php">
 
	<table align="center" border = "2" cellspacing ="0" cellpadding="3" id="brtable">
		<tr><td><b>Business Rule Type:</b></td> <td><b>Dedicated:</b></td><td><input type="button" Name= "Ajouterbr" Value="ADD BR" onclick="gobr()"></td></tr>
 
	</table>
 
<p><input type="submit" name="submit" value="Enter"></p>	
</form> 
 
<?php
}
?>
 
</body>
</html>

sur IE

si je cree une ligne et ensuite je clique sur Enter, tout va bien.
Mais maintenant:
- j'ouvre mon fichier br.php dans IE
- je ne cree aucune ligne dans ma table
-je soumets mon formulaire
-j'obtiens une erreur:
'0.name' is null or not an object
-je cree une ligne
-je resoumets mon formulaire
-je n'ai plus d'erreur.

En fait je me rends compte que la premiere fois que je soumets mon formulaire, si j'ai pas cree d'objets DOM, j'ai une erreur. En effet cell2.name="brdedicated"; n'existe pas puisque je n'ai pas cree de lignes dans ma table

Sur FF

je n'ai aucune erreur.

Comment puis je faire pour ne pas avoir d'erreur avec IE?

Merci beaucoup.

Billy

**E.Bzz** · 09/07/2009, 11h08

Bonjour,
une chose que je ne comprends pas : comment peux-tu avoir une erreur JavaScript lors de la soumission d'un formulaire, alors qu'il n'y a pas de onsubmit ?

Lors d'une soumission simple, JavaScript n'intervient pas

A+

**billyrose** · 09/07/2009, 11h14

Envoyé par E.Bzz

Bonjour,
une chose que je ne comprends pas : comment peux-tu avoir une erreur JavaScript lors de la soumission d'un formulaire, alors qu'il n'y a pas de onsubmit ?

Lors d'une soumission simple, JavaScript n'intervient pas

A+

En fait j'utilise JS seulement pour creer les lignes pas pour soumettre mon formulaire. j'ai un bouton input de type "submit"
voila mon formulaire initial (tel qu'il sera affiche la premiere fois que jóuvre ma page)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
<form method="POST" action="br.php">
 
	<table align="center" border = "2" cellspacing ="0" cellpadding="3" id="brtable">
		<tr><td><b>Business Rule Type:</b></td> <td><b>Dedicated:</b></td><td><input type="button" Name= "Ajouterbr" Value="ADD BR" onclick="gobr()"></td></tr>
 
	</table>
 
<p><input type="submit" name="submit" value="Enter"></p>	
</form>

Vous voyez que je n'ai que l'entete de ma table. JS me permet juste de creer des lignes et des les supprimer aussi

**andry.aime** · 09/07/2009, 11h17

Salut,
l'utilisation de l'attribut name avec JS pose des problèmes avec IE.
Pourquoi vouloir les modifier:

liste_bname[i].name = liste_bname[i].name + "_" + ind;

**billyrose** · 09/07/2009, 11h19

Envoyé par E.Bzz

Bonjour,
une chose que je ne comprends pas : comment peux-tu avoir une erreur JavaScript lors de la soumission d'un formulaire, alors qu'il n'y a pas de onsubmit ?

Lors d'une soumission simple, JavaScript n'intervient pas

A+

Justement. Je pensais aussi que JS n'allait pas intervenir puisque j'avais pas creer de lignes mais il semble que c'est pas le cas

**billyrose** · 09/07/2009, 11h31

Envoyé par andry.aime

Salut,
l'utilisation de l'attribut name avec JS pose des problèmes avec IE.
Pourquoi vouloir les modifier:

Oui je me dis aussi que cet attribut .name pose des problemes avec IE. En fait je les modifie parceque je peux creer plusieurs lignes et j'ai besoin de distinguer les noms des cellules.
Par exemple:

ligne 1:
cell2 : brdedicated_1

ligne 2.
cell2: brdedicated_2

et ainsi de suite.

**andry.aime** · 09/07/2009, 11h39

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
if(document.all)
{
  var cell_1 = document.createElement('td name="cell_'+compteur+'"');
}
else
{
  var cell_1 = document.createElement("td");
  cell_1.setAttribute("name","cell_"+compteur);
}

**billyrose** · 09/07/2009, 12h22

Envoyé par andry.aime

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
if(document.all)
{
  var cell_1 = document.createElement('td name="cell_'+compteur+'"');
}
else
{
  var cell_1 = document.createElement("td");
  cell_1.setAttribute("name","cell_"+compteur);
}

Merci pour votre reponse.

j'ai modifie mon code JS comme suit:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
var bUniqueRowID = 0;
function getXhr(){
    var xhr = null; 
	if(window.XMLHttpRequest) // Firefox and others
		xhr = new XMLHttpRequest(); 
	else if(window.ActiveXObject){ // Internet Explorer 
	   try {
			xhr = new ActiveXObject("Msxml2.XMLHTTP");
			} catch (e) {
				xhr = new ActiveXObject("Microsoft.XMLHTTP");
			}
	}
	else { // XMLHttpRequest not supported by your browser
		alert(" Your browser does not support XMLHTTPRequest objects..."); 
		xhr = false; 
		} 
     return xhr
	}
 
	/**
	*  method called when the user clicks on the button
	*/
 
function gobr(){
	var xhr = getXhr()
	// We defined what we gonna do with the response
	xhr.onreadystatechange = function(){
	// We do somthing once the server's response is OK
	if(xhr.readyState == 4 && xhr.status == 200){
 
 
			// Retrieve <table> ID and create a <tbody> element
 
			// Retrieve <table> ID and create a <tbody> element
 
			var tbl = document.getElementById("brtable");
			var tblBody = document.createElement("tbody");
			var row = document.createElement("tr");
 
			bUniqueRowID += 1;
 
 
 
 
			var cell_3 = document.createElement("td");
			cell_3.align="center";
			cell_3.valign="center";
 
			var ind=bUniqueRowID;
			if(document.all)
			{
			  var cell_1 = document.createElement('td name="brule_'+ind+'"');
			  var cell_2 = document.createElement('td name="brdedicated_'+ind+'"');
			}
			else
			{
			  var cell_1 = document.createElement("td");
			  cell_1.setAttribute("name","brule_"+ind);
			  var cell_2 = document.createElement("td");
			  cell_2.setAttribute("name","brdedicated_"+ind);
			}
			cell_1.align="center";
			cell_1.valign="center";	
			cell_2.align="center";
			cell_2.valign="center";			
 
		// Create the first cell which is a select
 
			var cell1 = document.createElement("div");
			cell1.innerHTML=xhr.responseText;
			cell_1.appendChild(cell1);		
 
		//Create the second cell a checked box
			var cell2=document.createElement("input");
			cell2.type="checkbox";
			//cell2.name="brdedicated";
			cell_2.appendChild(cell2);
 
 
		// Create the third cell which is a button
			var cell3=document.createElement("input");
			cell3.type="button";
			cell3.value="Delete"
			cell3.onclick=delRowbr;
			cell_3.appendChild(cell3);						
 
			// add cells to the row
			row.appendChild(cell_1);
			row.appendChild(cell_2);
			row.appendChild(cell_3);
 
		// add the row to the end of the table body
			tblBody.appendChild(row);
 
		// put the <tbody> in the <table>
			tbl.appendChild(tblBody);
 
		// sets the border attribute of tbl to 1;
			tbl.setAttribute("border", "2");
 
		}
	}
	xhr.open("GET","brded.php?dt=" + new Date().getTime(),true);
	xhr.send(null);
}

Non seulement j'ai toujours la meme erreur mais en plus la structure de ma table est totalement gache (voir fichier attache).

Merci

**Bovino** · 09/07/2009, 12h38

Salut,

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
if(document.all)
{
  var cell_1 = document.createElement('<td name="cell_'+compteur+'">');
}

**SpaceFrog** · 09/07/2009, 12h53

oui sous IE le name ne peut être attibué ni modifié en runtime (dynamiquement) selon msdn...

sujet déja abordé largement dasn ce topic :

http://www.developpez.net/forums/d53...ynamique-form/

ce qui voudrais dire que sous IE pour modifier un name il faudrait faire detruire puis recréer

**billyrose** · 09/07/2009, 12h53

Envoyé par Bovino

Salut,

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
if(document.all)
{
  var cell_1 = document.createElement('<td name="cell_'+compteur+'">');
}

Merci pour vos reponses.

je teste la suggestion de Bovino

**SpaceFrog** · 09/07/2009, 12h54

un td n'a pas pas de name ...

passe par les class

**billyrose** · 09/07/2009, 12h56

Envoyé par SpaceFrog

oui sous IE le name ne peut être attibué ni modifié en runtime (dynamiquement) selon msdn...

sujet déja abordé largement dasn ce topic :

http://www.developpez.net/forums/d53...ynamique-form/

ce qui voudrais dire que sous IE pour modifier un name il faudrait faire detruire puis recréer

j'ai deja lu votre topic mais j'ai pas compris grand chose.