Discussion :

[Invité]

Salut à tous,

Je cherche de l’aide en ce qui concerne un script JQuery de modification d’article, je m’explique… Je voudrais que l’utilisateur en cliquant sur le bouton « Corriger » puisse saisir une nouvelle valeur, grâce à un input de type text qui remplacerait la valeur entrée en HTML brut (cf. les deux images):

Mon code JQuery:

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 corrigerArticle(){
            $('.corriger').toggle();
            $('.supprimer').toggle();
            $('.accepter').toggle();
            $('.annuler').toggle();
 
            var par = $(this).parent();
 
            var identification = par.children("h1:nth-child(1)");
            //var notation = par.children("???");
            //var numerotation = par.children("???");
            //var datation = par.children("???");
            //var localisation = par.children("???");
            //var memorisation = par.children("???");
            //var remarquation = par.children("???");
 
            identification.html("<input type='text' id='txtName' value='"+identification.html()+"'/>");
            //notation.html("<input type='text' id='txtName' value='"+notation.html()+"'/>");
            //numerotation.html("<input type='text' id='txtName' value='"+numerotation.html()+"'/>");
            //datation.html("<input type='text' id='txtName' value='"+datation.html()+"'/>");
            //localisation.html("<input type='text' id='txtName' value='"+localisation.html()+"'/>");
            //memorisation.html("<input type='text' id='txtName' value='"+memorisation.html()+"'/>");
            //remarquation.html("<input type='text' id='txtName' value='"+remarquation.html()+"'/>");
        }
        $('.corriger').click(corrigerArticle);

Mon code HTML:

Code html :

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
<article class="fiche" id="a2">
    <h1>Marie Poudrière</h1>
    <img src="photos/marie.jpg" alt="photo"> 
    <table>
        <tr>
            <td class="information">Note: </td>
            <td class="note">8/10</td>
        </tr>
         <tr>                     
            <td class="information">Téléphone: </td>
            <td class="telephone">06.XX.XX.XX.XX</td>
        </tr>
        <tr>
            <td class="information">Date: </td>
            <td class="date">2014-11-15</td>
        </tr>
        <tr>
            <td class="information">Lieu de rencontre: </td>
            <td class="lieu-rencontre">XXXXXXX</td>
        </tr>
        <tr>
            <td class="information">Meilleur souvenir: </td>
            <td class="souvenir">XXXXXXX</td>
        </tr>
         <tr>
            <td class="information">Remarque(s): </td>
            <td class="remarque">XXXXXXX</td>
        </tr>
    </table>
    <input class="corriger" type="submit" value="Corriger">
    <input class="accepter" type="submit" value="Accepter">
    <input class="supprimer" type="submit" value="Supprimer">
    <input class="annuler" type="submit" value="Annuler">
</article>

Pourriez-vous m'aider à compléter les ".children("???");", s'il vous plait?

Le premier "identification" qui modifie le titre h1 fonctionne, mais je n'y arrive pas pour les autres...

Merci d'avance !

PS: ne faites pas attention aux noms que j'ai pu donner, ce n'est pas toujours très français...