Faire un colspan c'est impossible ?

**SweetLeaf** · 29/07/2008, 16h36

Bonjour tout le monde !!

Je vient de http://www.w3schools.com/ et j'ai trouver le code que je cherchais sauf qu'il ne marche pas.... En gors je veut appliquer a une colonne un colspan j'ai fait comme suis :

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
var BaliseLigne2 = document.createElement('tr');
        var BaliseCol2 = document.createElement('td');
        
        
        var BaliseAreaCom = document.createElement('textarea');

        BaliseLigne2.id='ligne'+(i-1);
        BaliseCol2.id='colcom'+(i-1);
        document.getElementById(BaliseCol2.id).colSpan="10";
        BaliseLigne2.appendChild(BaliseCol2);
        BaliseCol2.appendChild(BaliseAreaCom);
        
        BaliseLigne2.style.display = "none";
        
        var Cible = document.getElementById('Tab');
        Cible.appendChild(BaliseLigne2);

mais mon onclick ne marche plus donc impossible de savoir si ca marche ! (j'imagine que si ca fait bugger le onclick c'est que ca doit pas etre le bon code...) Si quelqu'un pouvais m'aider a trouver le code qui marche ou au moins un bout du code !!
Merci d'avance !!!

**Katachana** · 29/07/2008, 16h46

et comme ca ?

Code :

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

td.setAttribute("colSpan", "10")

**SweetLeaf** · 29/07/2008, 16h51

Merci pour ta réponse mais ça ne fonctionne pas non plus... je vais regarder avec WebDevelopper pour vois ce qu'il en est !

**Matthieu2000** · 29/07/2008, 16h54

Envoyé par SweetLeaf

var Cible = document.getElementById('Tab');
Cible.appendChild(BaliseLigne2);
!

il manque un tbody

**SweetLeaf** · 29/07/2008, 17h03

euh c'est quoi un tbody ?

- webdeveloppeur : l'affectation au td marche, j'ai bien :

Code :

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

<td colspan="10" width="100" height="100"></td>

et si je copie le code créé dans une page html vierge ça m'affiche bien le bon tableau avec le colspan...

**Eldar57** · 29/07/2008, 17h17

moi, j'aurai dit que c'est plutot ainsi:

document.getElementById(BaliseCol2.id).colspan="10";

je comprend pas la majuscule au milieu de colspan ...

**SweetLeaf** · 29/07/2008, 17h25

la majuscule je la tient du site de www.w3schools.com !!
je pense pas que ce soit ça qui fasse bugger...

Est-ce que c possible que cette méthode ne marche pas avec FF ??

**Eldar57** · 29/07/2008, 17h33

personnellement je suis en pleine réalisation d'un site internet, et j'utilise rowspan et colspan sous FF et ça marche ...

c'est pour ça que je ne comrpend pas la majuscule ... Javascript demande de respecter la casse. Donc j'essayerai quand même à ta place.

**SweetLeaf** · 29/07/2008, 17h40

J'ai essayé ca ne fonctionne pas...

Pourrais-tu me montrer ton code pour que je compare ??

**Auteur** · 29/07/2008, 18h30

attention à l'ordre des instructions !

Code :

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

1
2
3
 
        document.getElementById(BaliseCol2.id).colSpan="10";
        BaliseLigne2.appendChild(BaliseCol2);

tu fais un getElementById() avant appendChild(). Sois logique : comment cibler un élément qui n'est pas inclus dans la page ?

Ou alors remplace ton getElementById() par :

Code :

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

1
2
 
        BaliseCol2.colSpan="10";

et puis qu'est-ce je t'ai dit sur la création des lignes et des cellules dans un tableau ?

**SweetLeaf** · 30/07/2008, 10h18

Envoyé par Auteur

attention à l'ordre des instructions !

Code :

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

1
2
3
 
        document.getElementById(BaliseCol2.id).colSpan="10";
        BaliseLigne2.appendChild(BaliseCol2);

tu fais un getElementById() avant appendChild(). Sois logique : comment cibler un élément qui n'est pas inclus dans la page ?

Bien vu mais mes instructions sont dans le bon ordre j'ai fait gaffe cet fois-ci !!

Envoyé par Auteur

Ou alors remplace ton getElementById() par :

Code :

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

1
2
 
        BaliseCol2.colSpan="10";

Oui c'est le premier truc que j'avais mis et en plus je suis obligé si je veut que ca affiche mon tableau sinon avec getElementById même mon tableau ne se crée pas... mais ça n'étend toujours pas la colonne...

Envoyé par Auteur

et puis qu'est-ce je t'ai dit sur la création des lignes et des cellules dans un tableau ?

Oui il y a des fonctions mais je n'est pas le temps de tout revoir il faut que j'avance quand ce sera fini peut être je reprendrais le code pour l'optimiser mais la mon patron veut des résultats !! Alors ben je fait avec les moyen du bord...

Merci pour ta réponse je vous informe dès que j'ai des news pour mon colspan !!

**SweetLeaf** · 30/07/2008, 10h37

Je crois que je vais quand même essayer avec les fonction adapter !!
Je vous dis si ça marche !! (j'espère que oui !

)

**le_chomeur** · 30/07/2008, 11h00

salut

voici un petit exemple fonctionnel

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
 
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
<script type="text/javascript">
	function addUnder(element){
		//Création d'une ligne
		var ligne = document.createElement("tr");
		//création de deux ligne dont une avec un colspan de 2
		var celulle1 = document.createElement("td");
		celulle1.innerHTML = "case de deux colspan"
		celulle1.colSpan = "2";
 
		var celulle2 = document.createElement("td");
		celulle2.innerHTML = "aucun colspan";
		//Ajout des cellules dans la ligne
		ligne.appendChild(celulle1);
		ligne.appendChild(celulle2);
		//Ajout de la ligne en dessus de celle clickée
		var letbody = element.parentNode.parentNode;
		letbody.insertBefore(ligne, element.parentNode);
	}
</script>
</head>
 
<body>
<table width="200" border="1">
<tbody>
  <tr>
    <td>&nbsp;</td>
    <td onclick="addUnder(this)">click ici pour insérer une ligne de deux colonne</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tbody>
</table>
 
</body>
</html>

**SweetLeaf** · 30/07/2008, 11h09

Merci beaucoup je vais comparer et je te dis si ça marche !!

Code :

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

celulle1.innerHTML = "case de deux colspan"

Ça sert a quoi ?? c'est un genre de commentaire ?? infobulle ?

PS : il ne manquerais pas un ' ; ' ??

**Matthieu2000** · 30/07/2008, 11h20

tout ça pour éviter des

insertRow();
insertCell();

**SweetLeaf** · 30/07/2008, 11h22

Ça y est ça fonctionne !!

Mais ce qui est étrange c'est que mis a pars ton innerHTML on a le même code... Enfin bref le principale c'est que ça fonctionne !!!

Merci à tous !!!

PS: Au fait le_chomeur attention à l'orthographe ^^ celulle => cellule et au point virgule (surtout eux !!) Pour une fois que je vois des fautes autre part que dans mon code, j'en profite !!

Mathieu, promis la prochaine fois que je fait un tableau en DOM je m'en servirais !!!! Juré, craché !!! Mais je ne peut pas reprendre mon code il faut que je finisse tout ce matin...

A plus !!!