Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

jQuery Discussion :

Récupération ligne tableau pour envoi


Sujet :

jQuery

  1. #1
    Membre habitué
    Récupération ligne tableau pour envoi
    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 :
    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 :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
    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 html :Sélectionner tout -Visualiser dans une fenêtre à part
    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.

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

    j'ai fait ça :

    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
    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

  3. #3
    Invité
    Invité(e)
    Bonjour,

    Code :Sélectionner tout -Visualiser dans une fenêtre à part
    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

  4. #4
    Membre habitué
    d'abord merci pour ta réponse,

    cependant quand je mets :

    Code :Sélectionner tout -Visualiser dans une fenêtre à part
     console.log("nouveau "+val['id'].text);


    J'obtiens ça en sortie console :

    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 ?