Tableau en Javascript et Html aliment� par un Input ou une liste (array).

Bonjour

Je suis un d�butant en Javascript. Je souhaite cr�er un tableau pour analyser le jeu de la Roulette aliment� par un Input en Html /Javascript.

Le principe est le suivant : si une douzaine de num�ros sortent cons�cutivement, disons 13, 36, 28, 2, 23, 2, 23, 7, 21, 17, 22, 10, qu'ils puissent �tre entr�s dans un input Html et qu'� l'Onclick, ou � chaque ajout ils soient pr�sent�s verticalement dans un tableau Html de 3 colonnes:

Num�ro, Rang, position. Les positions correspondent � des valeurs de type chaine de caract�res, rang�es dans un tableau pr�-�tabli, correspondants � la position des num�ros sur le tapis de Roulette soit ici: D2L3, D3L1, D3L3, D1L2, D2L2, D1L2, D2L2, D1L3, D2L1, D2L2, D2L3,D1L3.

J'ai essay� ceci en HTML:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<html>
<h4>Numéro : <input type ="text"   name ="nnumero"  id ="fname" /><br/><br/>
 
Rang : <input type ="text"   name ="rrang"  id ="lname" /><br/><br/
 
Position : <input type ="text"   name ="pposition"  id ="age" /><br/><br/>
 
<button onclick ="add"> Ajouter une rangée </button>
<br/>
<button onclick  ="addHtmlTableRow()">Add </button>
<table id ="table">
 
	<tr>
 
<th> Numéro</th>
	<th>Rang</th>
	<th>Position </th>
 
</tr></table>
 
</html>

J'ai essay� cela en JAVASCRIPT :

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
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
<script>
 
var html = "<table><tr>";
	var perrow = 3 
      // 3 cells per row
	//Loop through table, add cells
 
}
	//  add Row
 function addHtmlTableRow()
 {
 
 	//get the table by id
 
var table = document.getElementById ("table"),
 
var newRow = table.insertRow(table.length), }
 
// get value from input text
 
cell1 = newRow.insertCell(0),
cell2 = newRow.insertCell(1),
cell3 = newRow.insertCell(2),
 
//set the value  into row cells
 
numero = document.getElementById ("numero").value,
rang = document.getElementById ("rang").value,
position = document.getElementById ("position").value;
 
Cell1.innerHTML = numero;
Cell2.innerHTML = rang;
Cell3.innerHTML = position;
 
// call the function to set the event to the new r
 
selectedRowToInput();
 
 
}
//  display selected row data into input text
 
function selectedRowToInput ()
{
 
 
 
for ( var i = 0; <table.rows.length; i++)
{
 
table.rows[i].onclick = function ()
 
// get the selectedd row index
 
rIndex = this.rowIndex ;
console.log(rIndex) ;
document.getElementById ("numero").value =this.cells[0].innerHTML;
document.getElementById ("rang").value =this.cells[1].innerHTML;
document.getElementById ("position").value =this.cells[2].innerHTML;
 
};
}
selectedRowToInput();
 
 
 
function editHtmlTableSelectedRow () {
 
 
var numero = document.getElementById("numero").value,
var rang = document.getElementById("rang").value,
var position = document.getElementById("positin").value,
 
 
 
table.rows [rIndex].cells[0]. innerHTML = numero;
 
 
table.rows [rIndex].cells[1]. innerHTML = rang;
 
 
table.rows [rIndex].cells[2]. innerHTML = position;
}
 
 
// Mtethode alternative
 
	for (var i = 0 ; i < array.length; i++ )
	{
 
		// create anew row
 
		var newRow = table.insertRow(table.length;
 
 
			for (var j = 0 ; i < table[i].length; j++ )
			{
 
				//create a new cell
 
           var cell = newRow.insertCell[j];
 
           // add value to the cell
 
           cell.innerHTML = table[i][j] ;
 
       }
			}
</script>