[AJAX] Auto complete sur un tableau dynamique (en javascript)

Salut,

Je suis toujours bloqué sur un exercice d'Auto Complete sur un tableau dynamique (moyennant javascript), je vous explique.

1. J'ai un tableau dynamique qui fonctionne à merveille. J'ajoute les lignes et je les annule sans problème avec du javascript (je partage avec vous mon code pour toute fin utile).

2. J'ai un Auto Complete qui fonctionne aussi très bien (qui se connecte sur la base de donnée sqlserver et rafraîchi ma zone de texte en moments de saisie).

Mon problème c'est que la zone de texte stipulée par le code d'autocomplete est identifié par un 'id' : #id_country hors je dois avoir un id dynamique sur mon tableau

Code d'auto complete :

Code:

1
2
3
4
5
6
7
$(document).ready(function()
{
	$("#id_country").autocomplete("ajaxcomplete.php", 
{
selectFirst: true
});
});

Le code du tableau :

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
/* trouve le tag "parentTagName" parent de "element" */
 
function getParent(element, parentTagName) 
{
    if ( ! element )
        return null;
    else if ( element.nodeType == 1 && element.tagName.toLowerCase() == parentTagName.toLowerCase() )
        return element;
    else
        return getParent(element.parentNode, parentTagName);
}
 
/* ajoute une ligne */
 
function addLigne(link) {
    // 1. récuperer le node "TABLE" à manipuler
    var td = link.parentNode;
    var table = getParent(td,'TABLE');
 
    // 2. on va manipuler le TBODY
    var tbody = table.tBodies[0];
 
    // 3. on clone la ligne de reference
    var newTr = tbody.rows[0].cloneNode(true);
    tbody.appendChild(newTr);
    if ( document.all )
        newTr.style.display = "block"; // pour IE
    else
        newTr.style.display = "table-row"; // pour Gecko
 
}
 
/* supprimer une ligne */
 
function delLigne(link) 
{
 
    // 1. récuperer le node "TABLE" à manipuler
    var td = link.parentNode;
    var table = getParent(td, 'TABLE');
 
    // 2. récuperer le TBODY
    var tbody = table.tBodies[0];
 
    // 3. Supprimer le TR
    tbody.removeChild(getParent(td, 'TR'));
 
}
 
/* 
window.onload = dtableInit;
 
/* initialise le script */
function dtableInit() 
{
    var table = document.getElementsByTagName('TABLE');
    for ( var i = 0; i < table.length; i++ ) 
	{
        // on récupère tous les tableaux dynamiques
        if ( table[i].className == 'dTable' ) 
		{
 
            var tbody = table[i].tBodies[0];
            var newTr = tbody.rows[0].cloneNode(true);
 
            // on masque la première ligne du tbody (la ligne de reference)
            tbody.rows[0].style.display = 'none';
 
            // on en ajoute une
            tbody.appendChild(newTr);
 
        }
    }
}

le code de mon tableau dont la zone de texte objet d'auto complete :

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
<form name="form"  method="POST">
 
<table class="dTable" align="center">
<thead>
    <tr bgcolor="#999999">
        <th> Id </th>
        <th>Countries </th>
        <th width="10px">devise</th>
        <th> </th>
    </tr>
</thead>
 
<tfoot>
    <tr>
        <th colspan="5"><a href="#" onclick="addLigne(this); return false;"> Ajouter un pays</a></th>
    </tr>
</tfoot>
 
<tbody>
 
    <tr>
        <td> <input type="text" name="id[]" style="width:40px"/> </td>
 
        <td> 
        	<input name="country[]" type="text" id="id_country" size="20"/>
        </td>
 
        <td> <input type="text" name="txt_devise[]" style="width:80px" /> </td>
        <td> <a href="#" onclick="delLigne(this); return false;"> Annuler </a> </td>
    </tr>
</tbody>
</table>

Mon problème:
1. L'auto saisie fonctionne très bien sur la 1ere ligne étant l'id (id_country ) est bien celui du 1er code dessus.
2. Le faite de faire un [] devant (id_country ) sur la zone de texte

Code:

<input name="country[]" type="text" id="id_country" size="20"/>

n'est pas reconnue par le script d'autocpmletion et ne permet pas l'autosaisie.

Je sollicite votre intelligence pour résoudre ce problème

Merci à l'avance :roll:.