prendre les valeur d'un tableau en javascript

Version imprimable

bonjour,
voila j'ai un tableau avec des radio buttoon a chaque ligne,et dans chaque <td> j'y est rajouter un id, je voudrait que la valeur des td d'une ligne se retrouve pre-remplit ds un formulaire pour effectuer une modification

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
var x1 = document.getElementById("r1" );
var x2 = document.getElementById("r2" );
var x3 = document.getElementById("r3" );
 
 
  if (x1.checked==true) {
document.getElementById("resp" ).value=document.getElementById("p1" ).value;
document.getElementById("nom" ).value=document.getElementById("p2" ).value;
  }
 
  if (x2.checked==true) {
 document.getElementById("resp" ).value=document.getElementById("L1" ).value;
document.getElementById("nom" ).value=document.getElementById("L2" ).value;
  }
 
  if (x3.checked==true){
  document.getElementById("resp" ).value=document.getElementById("g1" ).value;
document.getElementById("nom" ).value=document.getElementById("g2" ).value;
 
  }

voila un algo que j'ai essayer de faire mai sa marche pas :x

31/07/2008, 14h35
SpaceFrog

un peu court ???
elle viennent d'ou les valeurs pour le préremplissage ?

et accessoirement un td n'a pas une value mais un innerHTML
31/07/2008, 14h37
Invité

Salut,

peut-on voir le code du dit tableau?

A+

Code:

1
2
3
4
5
6
7
8
<table border="1" width="450px">
<tr><td>
<input type='radio' name='groop1'onchange='tect();' id='p1' value='1' /></td><td id='r1'>azeazea</td><td id='n1'>aezeaze</td><td id='p1'>aeaezae</td><td id='L1'>eazeae</td><td id='t1'>eaeaeae</td></tr>
<tr><td>
<input type='radio' name='groop1'onchange='tect();' id='r2' value='2' /></td><td id='p2'>azreaerzer</td><td id='n2'>rzrzrz</td><td id='p2'>erezrzr</td><td id='L2'>ezrezr</td><td id='t2'>rzezeze</td></tr><tr><td>
<input type='radio' name='groop1'onchange='tect();' id='r3' value='3' /></td><td id='r3'>zreze</td><td id='n3'>ezrzer</td><td id='p3'>zerzer</td><td id='m3'>ezrezr</td><td id='t3'>rezzer</td></tr><tr><td>
<input type='radio' name='groop1'onchange='tect();' id='r4' value='4' /></td><td id='r4'>youpi</td><td id='n4'>youpla</td><td id='p4'>haha</td><td id='m4'>hehe</td><td id='t4'>hoho</td></tr><tr><td>
<input type='radio' name='groop1'onchange='tect();' id='r5' value='5' /></td><td id='r5'>eeee</td><td id='n5'>eee</td><td id='p5'>eeee</td><td id='m5'>eeee</td><td id='t5'>eeee</td></tr></table>

31/07/2008, 14h58
madmax57

c'est bon j'arrive merci a intercalé les valeur du tableau dans mon formulaire c'est t bien Innerhtml
par contre comment je peut compter le nombres de ligne du tableau en javascript :) ?
31/07/2008, 15h04
Auteur

petite parenthèse :

n'utilise pas onchange sur des balises input, utilise plutôt l'événement onclick(). Avec onchange tu risques d'avoir des petits soucis (sous IE).
Là, si je ne me trompe pas, ta fonction tect() est appelée 2 (voire 4 fois) fois lorsque tu cliques sur un bouton radio.

Re,

Voilà

Code:

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title></title>
<style type="text/css">
  table { 	width: 450px; border-collapse: collapse; 	border: 1px solid black; }
</style>
<script type="text/javascript">
  function tect() {
 
    var x1 = document.getElementById("r1");
    var x2 = document.getElementById("r2");
    var x3 = document.getElementById("r3");
    var x4 = document.getElementById("r4");
    var x5 = document.getElementById("r5");
 
    if (x1.checked == true) {
        document.getElementById("resp" ).value = document.getElementById("u1" ).innerHTML;
        document.getElementById("nom" ).value = document.getElementById("n1" ).innerHTML;
    }
    if (x2.checked == true) {
        document.getElementById("resp" ).value = document.getElementById("u2" ).innerHTML;
        document.getElementById("nom" ).value = document.getElementById("n2" ).innerHTML;
    }
    if (x3.checked == true){
        document.getElementById("resp" ).value = document.getElementById("u3" ).innerHTML;
        document.getElementById("nom" ).value = document.getElementById("n3" ).innerHTML;
    }
    if (x4.checked == true){
        document.getElementById("resp" ).value = document.getElementById("u4" ).innerHTML;
        document.getElementById("nom" ).value = document.getElementById("n4" ).innerHTML;
    }
    if (x5.checked == true){
        document.getElementById("resp" ).value = document.getElementById("u5" ).innerHTML;
        document.getElementById("nom" ).value = document.getElementById("n5" ).innerHTML;
    }
  }
</script>
  </head>
  <body>
    <table >
      <tr><td>
          <input type="radio" name="groop1" onclick="tect();" id="r1" value="1" /></td>
        <td id="u1">azeazea</td>
        <td id="n1">aezeaze</td>
        <td id="p1">aeaezae</td>
        <td id="L1">eazeae</td>
        <td id="t1">eaeaeae</td>
      </tr>
      <tr><td>
          <input type="radio" name="groop1" onclick="tect();" id="r2" value="2" /></td>
        <td id="u2">azreaerzer</td>
        <td id="n2">rzrzrz</td>
        <td id="p2">erezrzr</td>
        <td id="L2">ezrezr</td>
        <td id="t2">rzezeze</td>
      </tr>
      <tr><td>
          <input type="radio" name="groop1" onclick="tect();" id="r3" value="3" /></td>
        <td id="u3">zreze</td>
        <td id="n3">ezrzer</td>
        <td id="p3">zerzer</td>
        <td id="m3">ezrezr</td>
        <td id="t3">rezzer</td>
      </tr>
      <tr><td>
          <input type="radio" name="groop1" onclick="tect();" id="r4" value="4" /></td>
        <td id="u4">youpi</td>
        <td id="n4">youpla</td>
        <td id="p4">haha</td>
        <td id="m4">hehe</td>
        <td id="t4">hoho</td>
      </tr>
      <tr><td>
          <input type="radio" name="groop1" onclick="tect();" id="r5" value="5" /></td>
        <td id="u5">eeee</td>
        <td id="n5">eee</td>
        <td id="p5">eeee</td>
        <td id="m5">eeee</td>
        <td id="t5">eeee</td>
      </tr>
    </table>
    <form action="#">
      responsable :<input id="resp" type="text" /><br />
      nom :<input id="nom" type="text" />
    </form>
  </body>
</html>

J'ai modifié des id qui doivent être unique

A+

31/07/2008, 15h11
madmax57

yep c fai j'ai mis onclick j'ai vue le pb que sa poser :).
vue que le tableau et generer par php dans une boucle ma fct aparait effectivement plusieur fois et je savais pas trop ou la metre,aut debut je voulé l'executer comme script permanant sur la page mai je c pas trop comment faire :p

Re

en un peu plus court avec des changement de "id" (c'est créer via php ou autre...)

Code:

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
<script type="text/javascript">
  function tect(id) {
 
    if (document.getElementById(id).checked == true) {
        document.getElementById("resp" ).value = document.getElementById(id + "u" ).innerHTML;
        document.getElementById("nom" ).value = document.getElementById(id + "n" ).innerHTML;
    }
  }
</script>
  </head>
  <body>
    <table border="1" width="450px">
      <tr><td>
          <input type="radio" name="groop1" onclick="tect(this.id);" id="r1" value="1" /></td>
        <td id="r1u">azeazea</td>
        <td id="r1n">aezeaze</td>
        <td id="r1p">aeaezae</td>
        <td id="r1L">eazeae</td>
        <td id="r1t">eaeaeae</td>
      </tr>
      <tr><td>
          <input type="radio" name="groop1" onclick="tect(this.id);" id="r2" value="2" /></td>
        <td id="r2u">azreaerzer</td>
        <td id="r2n">rzrzrz</td>
        <td id="r2p">erezrzr</td>
        <td id="r2L">ezrezr</td>
        <td id="r2t">rzezeze</td>
      </tr>
      <tr><td>
          <input type="radio" name="groop1" onclick="tect(this.id);" id="r3" value="3" /></td>
        <td id="r3u">zreze</td>
        <td id="r3n">ezrzer</td>
        <td id="r3p">zerzer</td>
        <td id="r3m">ezrezr</td>
        <td id="r3t">rezzer</td>
      </tr>
      <tr><td>
          <input type="radio" name="groop1" onclick="tect(this.id);" id="r4" value="4" /></td>
        <td id="r4u">youpi</td>
        <td id="r4n">youpla</td>
        <td id="r4p">haha</td>
        <td id="r4m">hehe</td>
        <td id="r4t">hoho</td>
      </tr>
      <tr><td>
          <input type="radio" name="groop1" onclick="tect(this.id);" id="r5" value="5" /></td>
        <td id="r5u">eeee</td>
        <td id="r5n">eee</td>
        <td id="r5p">eeee</td>
        <td id="r5m">eeee</td>
        <td id="r5t">eeee</td>
      </tr>
    </table>
    <form action="#">
      responsable :<input id="resp" type="text" /><br />
      nom :<input id="nom" type="text" />
    </form>
  </body>
</html>

31/07/2008, 15h58
madmax57

hey merci sa marche exactement comme je voulai
je tien sincerement à vous remercier :)