fusionner des cellules d'un tableau

**eyolas** · 16/04/2007, 09h33

Voila je fais un planning et je voudrais pouvoir fusionner les cellules du tableau lorsque je s�lectionne les cellules.

Voila mon exemple et j'aimerai que lorsque je s�lectionnne avec une couleur les cellules je veux que ca devienne un seul bloc

**SpaceFrog** · 16/04/2007, 09h46

si c'est sur une seul ligne il faut modifier le colspan de l'une des cellules, concant�ner le contenu des cellules selectionn�es puis supprimer les tds devenus inutiles ...

si �a s'�tend sur plusieurs lignes ... heu �a devient un peu plus complexe , il faudra alors faire la m�me chose sue le colspan

**eyolas** · 16/04/2007, 09h59

comment on fait avec du javscript pour modifier les collspan

**SpaceFrog** · 16/04/2007, 10h27

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

document.getElementsByTagName('table')[0].getElementsByTagnName('td')[2].colspan=3

j'ai pas test� mais peut �tre auras tu besoin de passer par un setAttribute ou le style ...

**eyolas** · 16/04/2007, 10h33

non marche pas.
En fait si tu as regard� mon exemple je veux que quand je s�lectionne plusieurs cellules au lieu que ca fait plen de carr� de la meme couleur je veux que ca devienne un bloc de la meme couleur

**SpaceFrog** · 16/04/2007, 11h05

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

colSpan

S majuscule ...

un exemple juste avec le onclick sur la premi�re cellule et sasn concat�nation de contenu ...

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
<script type='text/javascript'>
 
function mergeCells(cellule){
var NextTD
cellule.colSpan="2";
NextTD=cellule.nextSibling;
while(cellule.nextSibling.tagName!='TD'){NextTD=cellule.nextSibling.nextSibling;}
cellule.parentNode.removeChild(NextTD)
 
}
</script>
 
 
 
</head>
 
<body>
 
<table border="1" width="100%">
  <tr>
    <td onclick="mergeCells(this)">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
  </tr>
  <tr>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
  </tr>
</table>

**eyolas** · 16/04/2007, 11h23

ton exemple ne marche pas. Il y a un probleme avec ton script.

**eyolas** · 16/04/2007, 11h25

je rectifie le script marche pas sur firefox mais fonctionne sur ie. Mais il faut que cela fontionne sur ie et sur firefox. Si tu sait comment faut faire pour firefox

**SpaceFrog** · 16/04/2007, 11h27

ha oui firefox ...

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

while(cellule.nextSibling.tagName.toLowerCase()!='td'){NextTD=cellule.nextSibling.nextSibling;}

**eyolas** · 16/04/2007, 11h38

merci je vais essayer de l'adapter pour mon planning.
Je pense que j'aurai un probleme pour faire l'effet inverse.

fusionner des cellules d'un tableau

JavaScript

Vue hybride

Discussions similaires

Partager

Partager