Récupération ligne tableau pour envoi

Version imprimable

Bonjour,

J'ai un soucis concernant la récupération des éléments d'un tableau html codé dans un .JS

Ce que je cherche à faire c'est de récupérer les valeurs de ma ligne de tableau une fois que j'ai cliqué sur "edit" => permet l'édition d'une cellule du tableau
puis sur "save" => effectue un update en bdd et met à jour la valeur dans le tableau.

Donc j'arrive pour le moment à afficher le contenu de ma ligne éditée quand je clique sur le bouton "save".

Comme ceci :

Citation:

col_name id 4431 index: 0
index.js:1005 col_name client EDF GUADELOUPE index: 1
index.js:1005 col_name reference tred index: 2
index.js:1005 col_name pveuro index: 3
index.js:1005 col_name pv 18,294 index: 4
index.js:1005 col_name commande index: 5
index.js:1005 col_name dateduprix 13/10/2000 10:29:49 index: 6

En revanche je n'arrive pas à récupérer le contenu de mon col_name et de mon index.

Voiçi mon code JS :

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
function updateTableauClient(id, client, referenceclient, pv, pvfr, commande, dateduprixclient){
        /*var $url= $("#tableauClientsPourPiece").attr( "url" );
        alert("appel methode ajax !"+ $url); */
 
        var contenu_avant = $(this).text();
 
        $('#table2 tr').each(function() {
            var  identifiant = $(this).find(td).eq(0).html(); //L'index 0 permet de récupérer le contenu de la première cellule de la ligne
            console.log("id : "+identifiant+" champ_bdd ");
        });
 
      /*  var id_bdd = $('tr').attr("raw_id");
        var champ_bdd = $('tr').attr("col_name");*/
        //alert("avant =" + contenu_avant);
 
 
 
        $(this).blur(function()
        {
            var contenu_apres = $(this).text();
            //alert("contenu apres = " + contenu_apres); c
 
            if (contenu_avant != contenu_apres)
            {
                parametre='id='+id_bdd+'&champ='+champ_bdd+'&contenu='+contenu_apres ;
                //alert(param) ;
                $.ajax({
                    url: "updatedynamique.php",
                    type: "POST",
                    data: parametre,
                    success: function(html) {
                        //alert(html);
                    }
                });
            }
 
        });

Le code de mon tableau :

Code:

1
2
3
4
5
  <div id="tableauClientsPourPiece" class="native_scroll_container_bis" url="{{ path('updateTableauClient', {id: '0', client: 'a', pveuro: 0, pv: 0, commande: "a", dateduprix: "0000-00-00"}) }}">
 
                            <div class=".tbl_piecedetails_data" id="table2" ></div>
                            <div id="result2"></div>
                    </div>

Pouvez-vous m'aider pour récupérer les éléments de ma ligne, et pouvoir effectuer mon update en bdd. S'il vous plait ?
Merci d'avance.

Bon j'ai refait un truc plus clair dans mon bazar, ce qui simplifiera votre aide je pense.

j'ai fait ça :

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
 
  $(document).on('click', '.btn_save', function(event)
        {
            event.preventDefault();
 
            var row_id = "";
 
            var row_client = "";
            var row_reference = "";
            var row_pveuro = "";
            var row_commande = "";
            var row_dateduprix = "";
            var row_pv = "";
 
            var tbl_row = $(this).closest('tr');
            tbl_row.find('.row_data').each(function(index, val){  /* <====== Normalement mes valeurs sont stockées dans val */
                switch(index){
                    case 1:
                        alert("val "+val.html);
                        row_id = val.text;
                        break;
                    case 2:
                        row_client = val.value;
                        break;
                    case 3:
                        row_reference = val.value;
                        break;
                    case 4:
                        row_pveuro = val.value;
                        break;
                    case 5:
                        row_commande = val.value;
                        break;
                    case 6:
                        row_dateduprix = val.value;
                        break;
                    case 7:
                        row_pv = val.value;
                        break;
                    default:
                        row_id = 0;
                        row_client = "";
                        row_reference = "";
                        row_pveuro = "";
                        row_commande = "";
                        row_dateduprix = "";
                        row_pv = "";
                }
 
            });
 
            alert("rowid : "+row_id);
 
            parametre='row_id='+row_id+'&client='+row_client+'&reference='+row_reference+'&row_pveuro='+row_pveuro+'&row_commande='+row_commande
                +'&row_dateduprix='+row_dateduprix+'&row_pv='+row_pv;
            alert("param : "+parametre);
            $.ajax({
                url: "updatedynamique.php",
                type: "POST",
                data: parametre,
                success: function(html) {
                    alert(html);
                }
            });

du coup je vais jusqu'à ma redirection vers mon updatedynamique.php, mais mes paramètres, je n'arrive pas à les récupérer :grr

ça me met qu'il est undefined si je fais un val.html

ou si je mets que val, j'ai l'objet val [object HTMLDivElement]

Help me plz, merci:mrgreen:

Bonjour,

Code:

1
2
3
4
5
6
7
                    case 1:
                        alert("val "+val.html);
                        row_id = val.text;
                        break;
                    case 2:
                        row_client = val.value;
                        break;

Il faut éviter de mélanger les syntaxes de jQuery et du JavaScript pur.

En jQuery, c'est :

elt.val()
elt.html()
elt.text()

En JS pur :

elt.value
elt.innerHTML
elt.textContent

29/04/2020, 09h48
linuxien_62

d'abord merci pour ta réponse,

cependant quand je mets :

Code:

console.log("nouveau "+val['id'].text);

J'obtiens ça en sortie console :

Citation:

nouveau undefined
index.js:1065 col_name id 4431 index: 0
index.js:1065 col_name client EDF GUADELOUPE index: 1
index.js:1065 col_name reference ffbdb index: 2
index.js:1065 col_name pveuro index: 3
index.js:1065 col_name pv 18,294 index: 4
index.js:1065 col_name commande index: 5
index.js:1065 col_name dateduprix 13/10/2000 10:29:49 index: 6

En fait on peut voir que j'ai undefined en récupération, mais pourtant j'ai bien mon id de renseigné en index 0.
J'ai également essayé un val['id'].textContent et pareil undefined....

Je comprends pas. Comment je peux faire pour récupérer un élément ayant pour clé le col_name en index n ? :roll: