Discussion :

[JeanDan]

Bonjour,.

Dans mon body html je déclare une table :

Code :

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

1
2
3
4
5
6
7
8
<table border=1>
      <tr>
        <td width = 150 valign="top" style="text-decoration: underline; color: #4444ff;">
 
           <div id="side_bar"></div>
        </td>
      </tr>
    </table>

Dans une partie de mon programme j'utilise le Javascript. Dans cette partie j'aimerai AJOUTER une ligne dans le Tableau créer. Je me suis pris de plusieurs facon ss grand succés
Pouvez-vous m'aidez svp, en me donnant par exemple un exemple
^^

Merci

[le_chomeur]

cf la faq : http://javascript.developpez.com/faq...ble#AjoutLigne

[JeanDan]

Bonjour le_chomeur,

merci pr ton lien

Code :

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

1
2
3
4
5
6
7
8
9
10
11
function AddRow(){
alert('-1');
    var newRow = document.getElementById("side_bar").insertRow(-1);
alert('0');
    var newCell = newRow.insertCell(0);
alert('1');
    newCell.innerHTML = '[nouvelle cellule 0]';
alert('2');
    newCell = newRow.insertCell(1);
    newCell.innerHTML = '[nouvelle cellule 1]';
}

J'ai l'impression que mon script n'apprécie pas le ".insertRow(-1)" car avec le code ne s'éxécute pas et ss sa s'éxécute. De plus, lorsque je l'enléve le prog. ne s'exécute plus , de tt facon, à partir de
var newCell = newRow.insertCell(0);



Merci

[JeanDan]

Salut,
Voilà j'ai trouvé un code sur internet pour ajouter une ligne :

Code :

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

1
2
3
4
5
6
7
8
    var tableau=document.getElementById("ma_table");
    var ligne=document.createElement("tr");
    var col=document.createElement("td");
    col.setAttribute("colspan", "4");
    var test=document.createTextNode("nouvelle ligne");
    tableau.appendChild(ligne);
    ligne.appendChild(col);
    col.appendChild(test);

Mais je n'arrive pas du tout à ajouter un lien sur ligne, j'ai essayé plien de truc
par exemple :
function createLigne(){

Code :

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

1
2
3
4
5
6
7
8
9
10
	var tableau=document.getElementById("side_bar");
	var ligne=document.createElement("tr");
	var col=document.createElement("td");
	col.setAttribute("colspan", "4");
	var test=document.createTextNode(<a href="URL"> ' +" name" + '</a>);
alert('0');
	tableau.appendChild(ligne);
	ligne.appendChild(col);
	col.appendChild(test);
alert('1');

Mais sa ne marche pas.
Est ce que vous pourrez m'aider
Merci

[Bovino]

Code :

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

var test=document.createTextNode(<a href="URL"> ' +" name" + '</a>);

un lien n'est pas un noeud texte mais un élément HTML !

Code :

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

1
2
3
var test = document.createElement('a');
test.href = 'URL';
test.appendChild(document.createTextNode('name'));

[JeanDan]

Ahhhhhhhhhhhhhhh Bonjour Bovino,
Je suis ravi que qq1 est trouvé la soluce,
J'ai essayé ton code et il marche parfaitement

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
function createLigne(){
	var tableau=document.getElementById("side_bar");
	var ligne=document.createElement("tr");
	var col=document.createElement("td");
	col.setAttribute("colspan", "4");
	var test = document.createElement('a');
test.href = 'URL';
test.appendChild(document.createTextNode('name'));
	tableau.appendChild(ligne);
	ligne.appendChild(col);
	col.appendChild(test);
}

Je voudrai l'amélioré, c.a.d. que le lien en faite renvoi non pas vers un URL mais vers une fonction situé dans le script .....

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
function createLigne(){
	var tableau=document.getElementById("side_bar");
	var ligne=document.createElement("tr");
	var col=document.createElement("td");
	col.setAttribute("colspan", "4");
	var test = document.createElement('a');
test.href = ' "javascript:myclick(' + i + ')" ';
test.appendChild(document.createTextNode('name'));
	tableau.appendChild(ligne);
	ligne.appendChild(col);
	col.appendChild(test);
}
 
      function myclick(i) {
.............................
      }

Je ne sais pas si c'est la bonne syntaxe
test.href = "javascript:myclick(' + i + ')";
Merci bcp

[Bovino]

Code :

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

test.href = 'javascript:myclick(' + i + ')';

Suffit, solution plus élégante (pour éviter les pseudo-url) :

Code :

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

1
2
test.href = '#';
test.onclick = function(){myclick(i); return false}

Attention toutefois à la valeur de i !

[JeanDan]

REbonjour,
tout est parfait dans le code sa marche (..enfin presque ..) ! Le problème le plus délicat (tu as raison) est la valeur de >>>>> i <<<<<<!

En effet, lorsque je clique sur une des lignes aucun des liens ne marche. J'ai remarqué qu'en faite si j'avais 3 ligne i valait 4...... (à cause du i++)

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
function createLigneDePalmares(marker,comment){
	var tableau=document.getElementById("side_bar");
	var ligne=document.createElement("tr");
	var col=document.createElement("td");
	col.setAttribute("colspan", "4");
	var test = document.createElement('a');
gmarkers[i]=marker;
htmls[i]=comment;
alert('htmls[i] = ' + htmls[i]);
alert('gmarkers[i] = ' + gmarkers[i]);
//test.href = 'javascript:myclick(' + gmarkers[i] , htmls[i] + ')';
test.href = '#';
test.onclick = function(){myclick( i ); return true}
test.appendChild(document.createTextNode('name'));
	tableau.appendChild(ligne);
	ligne.appendChild(col);
	col.appendChild(test);
i++
 
}
      function myclick(i) {
alert('i = '+ i);
        gmarkers[i].openInfoWindowHtml(htmls[i]);
//Pq il n'associe pas à chaque gmarkers[i] le htmls[i] ??
      }

J'ai essayé plusieurs astuces .. mais vraiment là .... le problème du i ....
Je n'arrive pas (lorsqu'il y a plusieurs lignes ds la table) de définir le lien spécifique pour cette lignes ....

En esperant avoir été clair ...
MErci

[Bovino]

Code :

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

1
2
3
test.href = '#';
test.id = 'lien' + i;
test.onclick = function(){myclick(test.id); return false}

Mais le paramètre pour la fonction myclick est changé ! A prendre en compte dans le code.
Si tu veux récupérer la valeur de i :

Code :

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

1
2
3
4
function myclick(mon_id){
    var mon_param = mon_id.replace(/\D/g,'');
    // Reste de ton code
}

[JeanDan]

Excuse moi Bovino, je crois que je n'était pas assez clair.

En effet quand je voulais dire :
"Je n'arrive pas (lorsqu'il y a plusieurs lignes ds la table) de définir le lien spécifique pour cette lignes ...."
Je sous entendé par "lien" l'action click et non pas un URL. C'est à dire que je n'arrive pas à définir pour une ligne (de la table) son action click.
Car j'ai l'impression qu'il n'arrive pas à associer pour chaque ligne son [I]gmarkers avec son [I]htmls

Code :

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

1
2
3
4
5
6
 
function myclick(i) {
alert('i = '+ i);
        gmarkers[i].openInfoWindowHtml(htmls[i]);
//Pq il n'associe pas à chaque gmarkers[i] le htmls[i] ??
      }

Exemple :
J'ai 3 lignes dans la table :
1° ligne i=0
2° ligne i=1
3° ligne i=2
le programme est passé 3 fois par i++; donc i=0+1+1+1=3
lorsque je clique sur une ligne, de la table, i=3 CE QUI FAIT QUE Rien ne se passe car aucune action a été affecté pour i=3. Lorsque je clique sur une de ces lignes, j'ai toujours i=3 ......

function myclick(i) {
alert('i = '+ i);
gmarkers[i].openInfoWindowHtml(htmls[i]);
}

J'espère que vous avez saisie le problème
Cordialement,

[Bovino]

Oui, c'est bien pour cela que je t'ai proposé comme solution d'affecter un id spécifique à chaque passage dans la boucle ('lien'+i) puis d'affecter le onclick avec une référence à cet id plutôt qu'à l'indice.

[JeanDan]

Bonjour Bovino,
Merci pour ton code,
Tout marche, enfin, parfaitement ! (merci)
Code de la fct click :

Code :

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

1
2
3
4
      function myclick(mon_id) {
var mon_param = mon_id.replace(/\D/g,'');
gmarkers[ mon_param].openInfoWindowHtml(htmls[ mon_param]);
      }

Pourrais-tu m'expliquer, stp, ce qui signifie(/\D/g,'')
Si je veux "nettoyer" (effecer les lignes pour remettre d'autre ligne) de la table, il suffit que je mette l'indice i à 0.

Merci

[Bovino]

Pourrais-tu m'expliquer, stp, ce qui signifie(/\D/g,'')

Pour pouvoir créer un id "correct", il faut que celui-ci commence par une lettre, c'est pour cela que j'ai rajouté 'lien' à tes id. Ceci dit, j'ai pensé que ce que tu souhaitais récupérer dans ta fonction est juste l'indice associé, donc, le

Code :

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

mon_id.replace(/\D/g,'');

remplace tous les caractères qui ne sont pas des chiffres (le /\D/g) par rien ( '' ) et tu obtiens donc ton indice initial.

[JeanDan]

D'accord pour les explications ! merci

AHAHh la bonne blague
Je viens de remarqué un truc : Avec Firefox tout fonctionne correctement mais avec IE tout s'éxécute mais aucuns ligne ne s'affiche dans la table .....
J'ai trouvé un code (qui marche sous IE et firefox) pour ajouter une ligne;

Code :

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

1
2
3
    var newRow = document.getElementById('side_bar').insertRow(-1);
    var newCell = newRow.insertCell(i);
    newCell.innerHTML = 'name';

Mais c'est toujours la même histoire : ici c'est un noeud texte alors qu'on veux un élément HTML

Serait tu faire un élément HTML adapté à ce code (pour qu'il soit compatible à IE)

Merci infiniment !