Insertion d'une ligne d'un tableau HTML en base de données [Résolu/Fermé]

Signaler
Messages postés
127
Date d'inscription
lundi 31 octobre 2016
Statut
Membre
Dernière intervention
20 juin 2017
-
Messages postés
127
Date d'inscription
lundi 31 octobre 2016
Statut
Membre
Dernière intervention
20 juin 2017
-
Bonjour,

J'ai un tableau d'articles (contenant deux colonnes , une colonne Charge et une colonne Coût).

Ce tableau est affiché à partir de ma base de données.
A chaque fois , lorsque je veux insérer des nouveaux articles, je clique sur un bouton "+", ce bouton fait appel à une fonction javascript qui me permet d'ajouter une ligne à la fin du tableau,

mon probleme est que j'arrive pas à récupérer le contenu de cette ligne pour l' insérer dans ma base de données.
Je vous montre le code javascript , le code de mon bouton et le code de récupération des valeurs saisies en espérant que vous pourrez m'aider :)






2 réponses

Messages postés
2371
Date d'inscription
lundi 11 février 2013
Statut
Membre
Dernière intervention
13 janvier 2021
444
Salut,

Pour commencer, essaye si possible de ne pas passer par une image pour nous transmettre ton code. Tu peux coller tes codes sources sur le forum via le bouton "code" comme expliqué ici : https://codes-sources.commentcamarche.net/faq/10686-le-nouveau-codes-sources-comment-ca-marche#balises-code

Pour récupérer les données saisies dans les input html, la solution classique est d'utiliser un formulaire. As tu bien un formulaire qui englobe tous les input de ton document ?

Enfin si tu veux pouvoir saisir et récupérer plusieurs ligne de ton tableau, les input doivent être nommés comme des tableaux (en ajoutant []) afin de récupérer l'ensemble des input et pas uniquement le dernier. Exemple :
<input type="text" name="libelleCh[]">


Au passage, l'input name="libelleCh" dans la fonction javascript n'est pas correctement fermé, il manque un caractère '>' pour fermer l'input avant le tag '</td>'.

Bonne journée,
Messages postés
2371
Date d'inscription
lundi 11 février 2013
Statut
Membre
Dernière intervention
13 janvier 2021
444
Il manque le début du document html mais l'erreur semble déjà visible : tu as deux formulaires imbriqués dans ton document ce qui n'est pas correct.
Tu ne devrais avoir qu'un seul formulaire pour ton document, ou si tu as besoins de deux formulaires, ceux-ci doivent être distinct et pas imbriqués.
Messages postés
127
Date d'inscription
lundi 31 octobre 2016
Statut
Membre
Dernière intervention
20 juin 2017

Merci énormément Pitet :D j'ai enlevé le formulaire imbriqué et $_POST m'affiche des valeurs mais ça m'affiche que les colonnes de la dernière ligne, alors que j'ai ajouté plusieurs lignes et j'ai besoin de les récupérer toutes :(
Messages postés
2371
Date d'inscription
lundi 11 février 2013
Statut
Membre
Dernière intervention
13 janvier 2021
444
As tu bien renommé tes inputs comme des tableaux ? (cf. mon premier message)
Messages postés
127
Date d'inscription
lundi 31 octobre 2016
Statut
Membre
Dernière intervention
20 juin 2017

Oui j'ai fait comme ça

<td> <input type="text" name="libChD[]" value="<?php echo $rowCh[0]; ?>" > </td>
<td> <input type="text" name="coutChD[]" value="<?php echo $rowCh[1]; ?>" > </td>
Messages postés
2371
Date d'inscription
lundi 11 février 2013
Statut
Membre
Dernière intervention
13 janvier 2021
444
Si tu as également bien renommé des inputs sous forme de tableau dans la fonction js qui ajoute une ligne au tableau, tu devrais récupérer via $_POST l'ensemble des valeurs de chaque ligne.
Si cela ne fonctionne pas, peux tu nous remontrer le code html généré afin que nous puissions le tester ?
Messages postés
127
Date d'inscription
lundi 31 octobre 2016
Statut
Membre
Dernière intervention
20 juin 2017

Je te remercie beaucoup Pitet pour tes efforts et tes réponses :D
Les inputs dans ma fonction javascript sont nommés sous forme de tableau mais ça n'affiche que la dernière ligne :// . Voici ma fonction javascript
 function AjouterChargesDivers()
     {
        document.getElementById("t03").insertRow(-1).innerHTML='<td><input type="text" name="libelleCh[]" style="border:0px"> </td> <td> <input type="text" name="coutCh[]" style="border:0px" ></td> ' ;
     }

Le code html de ma page est le suivant :


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd%22>
<html http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html|nofollow] xmlns="[http://www.w3.org/1999/xhtml%22>
<head>
<script http://www.w3.org/1999/xhtml">
<head>
<script|nofollow] src="[https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js%22></script>
<style>
table https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<style>
table|nofollow] {
    width:100%;
}
table, th, td {
    border: 1px solid black;
    border-collapse: collapse;
}
th, td {
    padding: 5px;
    text-align: left;
}
table#t01 tr:nth-child(even) {
    background-color: white;
}
table#t01 tr:nth-child(odd) {
   background-color:white;
}
table#t01 th {
    background-color: #60c8f2;
    color: white;
}
</style>


<style>
table {
    width:100%;
}
table, th, td {
    border: 1px solid black;
    border-collapse: collapse;
}
th, td {
    padding: 5px;
    text-align: left;
}
table#t02 tr:nth-child(even) {
    background-color: white;
}
table#t02 tr:nth-child(odd) {
   background-color:white;
}
table#t02 th {
    background-color: #60c8f2;
    color: white;
}
</style>

<!--  -->
<style>
table {
    width:100%;
}
table, th, td {
    border: 1px solid black;
    border-collapse: collapse;
}
th, td {
    padding: 5px;
    text-align: left;
}
table#t03 tr:nth-child(even) {
    background-color: white;
}
table#t03 tr:nth-child(odd) {
   background-color:white;
}
table#t03 th {
    background-color: #60c8f2;
    color: white;
}
</style>


<script type="text/javascript">
/*var xx = $.ajax({
    type: "GET",
  url: "test.php" ,
  data: null,
  cache: false,
  success: function(){
     Console.Log("gfggfgg");

});
 Console.Log("xx");


*///var tabTache=var tbTch=["Tache1","Tache2","Tache3","Tache4","Tache5","Tache6"];function AjouterTache() { var newRow = document.getElementById("t01").insertRow(-1); //var newCell = newRow.insertCell(0); newCell.innerHTML= '<input name="libelleArticle" type="text" id="libelleArticle" style="border:0px" maxlength="60" size="30">';var newCell=newRow.insertCell(0);newCell.innerHTML='<select id="listeArticle"> <option value="" selected="Selected">--Choisisser un article--</option> for (var i = 0; i < tbTch.length; i++) { <option>  tbTch[i]; </option> }; <option>Article2 </option> '; newCell = newRow.insertCell(1); newCell.innerHTML = '<input type="text" style="border:0px" name="quantiteArticle"  id="quantiteArticle">'; newCell=newRow.insertCell(2); newCell.innerHTML='<input type="text" style="border:0px" name="prixUnitArticle" id="prixUnitArticle">';newCell=newRow.insertCell(3); newCell.innerHTML='<input type="text" style="border:0px" name="prixTotalArticle" id="prixTotalArticle">';}function AjouterTacheOublie()     {                /*for (var i = 0; i < tbTch.length; i++) {            write (tbTch[i]);        };*/        //alert(tbTch);      document.getElementById("t01").insertRow(-1).innerHTML = '<td><select id="listeArticle" style="border:0px"> <option value="" selected="Selected">--Choisisser une tâche--</option>  <option> </option> <option>Tâche2 </option><input type="text" style="border:0px"></td> <td><input type="text" style="border:0px"></td>  <td><input type="time" style="border:0px"></td>  <td><input type="time" style="border:0px"></td>  <td><input type="text" style="border:0px"></td> ';          // var nbLignes = document.getElementById("t01").rows.length;     alert (nbLignes);     }     function AjouterArticleOublie()     {      document.getElementById("rounded-corner").insertRow(-1).innerHTML = '<td><input type="text" style="border:0px"></td> <td><input type="text" style="border:0px"></td>  <td><input type="text" style="border:0px"></td>  <td><input type="text" style="border:0px"></td>';     }     function AjouterEmploye()     {      document.getElementById("t02").insertRow(-1).innerHTML = '<td><input type="text" style="border:0px"></td> <td><input type="time" style="border:0px"></td>  <td><input type="time" style="border:0px"></td>  <td><input type="text" style="border:0px"></td> ';     }function AjouterArticle() { var newRow = document.getElementById("rounded-corner").insertRow(-1); //var newCell = newRow.insertCell(0); newCell.innerHTML= '<input name="libelleArticle" type="text" id="libelleArticle" style="border:0px" maxlength="60" size="30">';var newCell=newRow.insertCell(0);newCell.innerHTML='<select id="listeArticle"> <option value="" selected="Selected">--Choisisser un article--</option> <option>Article1 </option> <option>Article2 </option> '; newCell = newRow.insertCell(1); newCell.innerHTML = '<input type="text" style="border:0px" name="quantiteArticle"  id="quantiteArticle">'; newCell=newRow.insertCell(2); newCell.innerHTML='<input type="text" style="border:0px" name="prixUnitArticle" id="prixUnitArticle">';newCell=newRow.insertCell(3); newCell.innerHTML='<input type="text" style="border:0px" name="prixTotalArticle" id="prixTotalArticle">';}     function AjouterChargesDivers()     {        document.getElementById("t03").insertRow(-1).innerHTML='<td><input type="text" name="libelleCh[]" style="border:0px"> </td> <td> <input type="text" name="coutCh[]" style="border:0px" ></td> ' ;     }</script><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>IN ADMIN PANEL | Powered by INDEZINER</title><link rel="stylesheet" type="text/css" href="style.css" /><script type="text/javascript" src="jquery.min.js"></script><script type="text/javascript" src="ddaccordion.js"></script><script type="text/javascript">ddaccordion.init({ headerclass: "submenuheader", //Shared CSS class name of headers group contentclass: "submenu", //Shared CSS class name of contents group revealtype: "click", //Reveal content when user clicks or onmouseover the header? Valid value: "click", "clickgo", or "mouseover" mouseoverdelay: 200, //if revealtype="mouseover", set delay in milliseconds before header expands onMouseover collapseprev: true, //Collapse previous content (so only one open at any time)? true/false  defaultexpanded: [], //index of content(s) open by default [index1, index2, etc] [] denotes no content onemustopen: false, //Specify whether at least one header should be open always (so never all headers closed) animatedefault: false, //Should contents open by default be animated into view? persiststate: true, //persist state of opened contents within browser session? toggleclass: ["", ""], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"] togglehtml: ["suffix", "<img src='images/plus.gif' class='statusicon' />", "<img src='images/minus.gif' class='statusicon' />"], //Additional HTML added to the header when it's collapsed and expanded, respectively  ["position", "html1", "html2"] (see docs) animatespeed: "fast", //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow" oninit:function(headers, expandedindices){ //custom code to run when headers have initalized  //do nothing }, onopenclose:function(header, index, state, isuseractivated){ //custom code to run whenever a header is opened or closed  //do nothing }})</script><script src="jquery.jclock-1.2.0.js.txt" type="text/javascript"></script><script type="text/javascript" src="jconfirmaction.jquery.js"></script><script type="text/javascript">  $(document).ready(function() {  $('.ask').jConfirmAction(); }); </script> <script type="text/javascript">             var l = 0;             function addKid3()            {                if (l< 10)                {                    var newRow = document.createElement('tr');                     newRow.innerHTML = '<td> <input type="text" style="border:0px" name="libChD'+l+'" ><td> <input type="text" style="border:0px" name="coutChD'+l+'" ></td>';                     document.getElementById('t03').appendChild(newRow);                    l++;                }            }             function removeKid(element)            {               // document.getElementById('rounded-corner').removeChild(element.parentNode);                //i--;            }         </script><script language="javascript" type="text/javascript" src="niceforms.js"></script><link rel="stylesheet" type="text/css" media="all" href="niceforms-default.css" /></head><body><div id="main_container"> <div class="header">    <div class="logo"><a href="#" rel="nofollow noopener noreferrer" target="_blank"><img src="images/logo.gif" alt="" title="" border="0" /></a></div>        <div class="right_header">Welcome Admin, <a href="#" rel="nofollow noopener noreferrer" target="_blank">Visit site</a> | <a href="#" rel="nofollow noopener noreferrer" target="_blank" class="messages">(3) Messages</a> | <a href="#" rel="nofollow noopener noreferrer" target="_blank" class="logout">Logout</a></div>    <div class="jclock"></div>    </div>        <div class="main_content">                        <div class="menu">                    <ul>                                        <li><a href="list.html" rel="nofollow noopener noreferrer" target="_blank">Manage Categories<!--[if IE 7]><!--></a><!--<![endif]-->                    <!--[if lte IE 6]><table><tr><td><![endif]-->                        <ul>                        <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">Lorem ipsum dolor sit amet</a></li>                        <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">Lorem ipsum dolor sit amet</a></li>                        <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">Lorem ipsum dolor sit amet</a></li>                        <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">Lorem ipsum dolor sit amet</a></li>                        <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">Lorem ipsum dolor sit amet</a></li>                        </ul>                    <!--[if lte IE 6]></td></tr></table></a><![endif]-->                    </li>                    <li><a href="login.html" rel="nofollow noopener noreferrer" target="_blank">Gestion des interventions<!--[if IE 7]><!--></a><!--<![endif]-->                    <!--[if lte IE 6]><table><tr><td><![endif]-->                        <ul>                        <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">Lorem ipsum dolor sit amet</a></li>                        <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">Lorem ipsum dolor sit amet</a></li>                        <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">Lorem ipsum dolor sit amet</a></li>                        <li><a class="sub1" href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">sublevel2<!--[if IE 7]><!--></a><!--<![endif]-->                        <!--[if lte IE 6]><table><tr><td><![endif]-->                            <ul>                                <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">sublevel link</a></li>                                <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">sulevel link</a></li>                                <li><a class="sub2" href="#nogo" rel="nofollow noopener noreferrer" target="_blank">sublevel3<!--[if IE 7]><!--></a><!--<![endif]-->                                                        <!--[if lte IE 6]><table><tr><td><![endif]-->                                    <ul>                                        <li><a href="#nogo" rel="nofollow noopener noreferrer" target="_blank">Third level-1</a></li>                                        <li><a href="#nogo" rel="nofollow noopener noreferrer" target="_blank">Third level-2</a></li>                                        <li><a href="#nogo" rel="nofollow noopener noreferrer" target="_blank">Third level-3</a></li>                                        <li><a href="#nogo" rel="nofollow noopener noreferrer" target="_blank">Third level-4</a></li>                                    </ul>                                                        <!--[if lte IE 6]></td></tr></table></a><![endif]-->                                </li>                                <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">sulevel link</a></li>                            </ul>                        <!--[if lte IE 6]></td></tr></table></a><![endif]-->                        </li>                                             <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">Lorem ipsum dolor sit amet</a></li>                        </ul>                    <!--[if lte IE 6]></td></tr></table></a><![endif]-->                    </li>                    <li><a href="login.html" rel="nofollow noopener noreferrer" target="_blank">Gestion des BC<!--[if IE 7]><!--></a><!--<![endif]-->                    <!--[if lte IE 6]><table><tr><td><![endif]-->                        <ul>                        <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">Lorem ipsum dolor sit amet</a></li>                        <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">Lorem ipsum dolor sit amet</a></li>                        <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">Lorem ipsum dolor sit amet</a></li>                        <li><a class="sub1" href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">sublevel2 <!--[if IE 7]><!--></a><!--<![endif]-->                        <!--[if lte IE 6]><table><tr><td><![endif]-->                            <ul>                                <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">sublevel link</a></li>                                <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">sulevel link</a></li>                                <li><a class="sub2" href="#nogo" rel="nofollow noopener noreferrer" target="_blank">sublevel3<!--[if IE 7]><!--></a><!--<![endif]-->                                                        <!--[if lte IE 6]><table><tr><td><![endif]-->                                    <ul>                                        <li><a href="#nogo" rel="nofollow noopener noreferrer" target="_blank">Third level-1</a></li>                                        <li><a href="#nogo" rel="nofollow noopener noreferrer" target="_blank">Third level-2</a></li>                                        <li><a href="#nogo" rel="nofollow noopener noreferrer" target="_blank">Third level-3</a></li>                                        <li><a href="#nogo" rel="nofollow noopener noreferrer" target="_blank">Third level-4</a></li>                                    </ul>                                                        <!--[if lte IE 6]></td></tr></table></a><![endif]-->                                </li>                                <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">sulevel link</a></li>                            </ul>                        <!--[if lte IE 6]></td></tr></table></a><![endif]-->                        </li>                                             <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">Lorem ipsum dolor sit amet</a></li>                        </ul>                    <!--[if lte IE 6]></td></tr></table></a><![endif]-->                    </li>                    <li><a href="login.html" rel="nofollow noopener noreferrer" target="_blank">Settings<!--[if IE 7]><!--></a><!--<![endif]-->                    <!--[if lte IE 6]><table><tr><td><![endif]-->                        <ul>                        <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">Lorem ipsum dolor sit amet</a></li>                        <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">Lorem ipsum dolor sit amet</a></li>                        <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">Lorem ipsum dolor sit amet</a></li>                        <li><a class="sub1" href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">sublevel2<!--[if IE 7]><!--></a><!--<![endif]-->                        <!--[if lte IE 6]><table><tr><td><![endif]-->                            <ul>                                <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">sublevel link</a></li>                                <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">sulevel link</a></li>                                <li><a class="sub2" href="#nogo" rel="nofollow noopener noreferrer" target="_blank">sublevel3<!--[if IE 7]><!--></a><!--<![endif]-->                                                        <!--[if lte IE 6]><table><tr><td><![endif]-->                                    <ul>                                        <li><a href="#nogo" rel="nofollow noopener noreferrer" target="_blank">Third level-1</a></li>                                        <li><a href="#nogo" rel="nofollow noopener noreferrer" target="_blank">Third level-2</a></li>                                        <li><a href="#nogo" rel="nofollow noopener noreferrer" target="_blank">Third level-3</a></li>                                        <li><a href="#nogo" rel="nofollow noopener noreferrer" target="_blank">Third level-4</a></li>                                    </ul>                                                        <!--[if lte IE 6]></td></tr></table></a><![endif]-->                                </li>                                <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">sulevel link</a></li>                            </ul>                        <!--[if lte IE 6]></td></tr></table></a><![endif]-->                        </li>                                             <li><a href="" title=" rel="nofollow noopener noreferrer" target="_blank" ">Lorem ipsum dolor sit amet</a></li>                        </ul>                    <!--[if lte IE 6]></td></tr></table></a><![endif]-->                    </li>                                      <li><a href="">Contact</a></li>                    </ul>                    </div>                     <div class="center_content">          <div class="right_content">                        <h2>Fiche d'intervention </h2>              <div class="form">         <form name="fmodif" action="" method="POST" class="niceform">                         <fieldset>                    <dl>                        <dt><label for="cli">Client:</label></dt>                        <dd><input type="text" name="cli"  size="59" accept='type MIME' value="STE AGRO-CHYM" /></dd>                    </dl>                    <dl>                        <dt><label for="adresse">Adresse:</label></dt>                        <dd><input type="text" name="adr" id="" size="59" value="Medenine" /></dd>                    </dl>                                                          <dl>                        <dt><label for="typeinter">Type d'intervention:</label></dt>                        <dd>                            <select size="1" name="typeinter" id="">       <option value= "typeintervention"> Reparation </option>        </select>                        </dd>      </dl>       <dl>                        <dt><label for="ddi">Date Debut Intervention:</label></dt>                        <dd><input type="date" name="ddi" size="59" value=2016-02-01   />  </dd>                    </dl>       <dl>                        <dt><label for="password">Date Fin Intervention:</label></dt>                        <dd><input type="date" name="dfi" id="ddf" size="59" value=2016-02-05 /></dd>                    </dl>                       <dl>                        <dt><label for="heuredebut">Heure Début:</label></dt>                        <dd><input type="time" name="heuredebut" id="ddf"  value=10:00                                                 />                     </dd>                    </dl>                               <dl>                        <dt><label for="heurefin">Heure Fin:</label></dt>                        <dd><input type="time" name="heurefin" id="ddf" value="12:30" /></dd>                    </dl>      </fieldset>                        <dl><dt><label for="mat">Tâches réalisées:</label>  <input type="button" name="ajout_tache" onClick="AjouterTache()" value="+" /> </dt> </dl>                         <!--onClick="AjouterTache(document.getElementById('libtache').value,document.getElementById('coutparheuretache').value,document.getElementById('heuredebtache').value,document.getElementById('heurefintache').value,document.getElementById('totaltache').value)" value="+" /> </dt> </dl> -->        <table id="t01">        <tr>            <th scope="col" class="rounded">Tâche</th>            <th scope="col" class="rounded">Coût/Heure</th>            <th scope="col" class="rounded">Heure Debut</th>            <th scope="col" class="rounded">Heure Fin</th>            <th scope="col" class="rounded-q4">Total</th>        </tr>        <tbody>                    <tr>                               <td> <input type="text" style="border:0px" name="libtache[]" value="Tache2"></td>            <td><input type="text" style="border:0px" name="coutparheuretache[]" value="100.000"></td>             <td> <input type="time" style="border:0px" name="heuredebtache[]" value="12:00" > </td>             <td> <input type="time" style="border:0px" name="heurefintache[]" value="13:30" > </td>            <td> <input type="text" style="border:0px" name="totaltache[]" value="150" > </td>                                   </tr>       </tbody>                               <td> <input type="text" style="border:0px" name="libtache[]" value="Tache1"></td>            <td><input type="text" style="border:0px" name="coutparheuretache[]" value="200.000"></td>             <td> <input type="time" style="border:0px" name="heuredebtache[]" value="10:00" > </td>             <td> <input type="time" style="border:0px" name="heurefintache[]" value="12:00" > </td>            <td> <input type="text" style="border:0px" name="totaltache[]" value="400" > </td>                                   </tr>       </tbody>   </table>  <dl>        <dt><label for="mat">Articles consommés:</label>  <input type="button" id="ajout_article" name ="ajout_article" onClick="AjouterArticle()" value="+" /> </dt>        </dl>          <table id="rounded-corner">        <tr>           <th>Matière</th>   <th>Qte</th>   <th>PU</th>            <th>PT</th>        </tr>     <tbody>  <tr>           <td><input type="text" style="border:0px" value="Cable" ></td>     <td>10</td>        <td>10.000</td>    <td>100</td>                        </tr>  <!--<tr> <td>Total: </td> <td> </td></tr> -->    </tbody>           <td><input type="text" style="border:0px" value="Article2" ></td>     <td>4</td>        <td>5.000</td>    <td>20</td>                        </tr>  <!--<tr> <td>Total: </td> <td> </td></tr> -->    </tbody>  </table> <table id="t02" summary="2007 Major IT Companies' Profit" align="center"><dl><dt><label for="mat">Employés :</label> <input type="button" id="ajout_employe" onClick="AjouterEmploye()" value="+" /></dt></dl>   <tfoot>         </tfoot>    <tbody> <tr>             <th>Employé</th>   <th>Heure début</th>   <th>Heure Fin</th>            <th>Coût Employé</th>    </tr>       <tr>            <td> <input type="text" style="border:0px" name="nomemp" value="LM LM" > </td>   <td><input type="time" name="h21" style="border:0px" value=12:00      > </td>   <td><input type="time" name="h22" style="border:0px" value=14:00      > </td>           <td> <input type="text" style="border:0px" name="coutemp" value="60" > </td>                                </tr>     <tr>            <td> <input type="text" style="border:0px" name="nomemp" value="Kamal" > </td>   <td><input type="time" name="h21" style="border:0px" value=12:00      > </td>   <td><input type="time" name="h22" style="border:0px" value=13:30      > </td>           <td> <input type="text" style="border:0px" name="coutemp" value="30" > </td>                                </tr>    </tbody></table> </dl> <dl>  <dl>  <dt><label for="vhcl">Véhicule utilisée :</label> </dt>  <dd>     <input type="text" name="vhcl" size="59" value="RENAULT 186 TUN 2574" /></dd>       <dd>    </dl> <dl>    <dt><label for="nbkm">Distance en KM :</label></dt>    <dd><input type="text" name="nbkm" id="nbkm" size="59" value="8" /></dd>     </dl>    <dl>    <dt><label for="coutvh">Cout Vehicule:</label></dt>    <dd><input type="text" name="coutvh" id="coutvh" size="59" value=80      />    </dd>     </dl>    <dl> <dt>    <label for="mat">Charges Divers :</label>  <input type="button" id="ajout_chargesDivers" onClick="AjouterChargesDivers()" value="+" name="ajout_chargesDivers" /> </dt></dl> <table id="t03" summary="2007 Major IT Companies' Profit">     <thead>     <tr>     <th scope="col" class="rounded">Charge</th>     <th scope="col" class="rounded">Coût</th>      </tr>    </thead>    <tbody>        <tr>            <td> <input type="text" name="libChD[]" style="border:0px" value="ticket Restaurant" > </td>            <td> <input type="text" name="coutChD[]" style="border:0px" value="100.000" > </td>                             </tr>      <tbody>        <tr>            <td> <input type="text" name="libChD[]" style="border:0px" value="logement" > </td>            <td> <input type="text" name="coutChD[]" style="border:0px" value="102.000" > </td>                             </tr>      <tbody>        <tr>            <td> <input type="text" name="libChD[]" style="border:0px" value="BON GAZOIL" > </td>            <td> <input type="text" name="coutChD[]" style="border:0px" value="20.000" > </td>                             </tr>  <pre class='xdebug-var-dump' dir='ltr'><small>string</small> <font color='#cc0000'>'charge'</font> <i>(length=6)</i></pre><pre class='xdebug-var-dump' dir='ltr'><small>string</small> <font color='#cc0000'>'150'</font> <i>(length=3)</i></pre>     </tbody></table>  <dl>   <dt><label for="consommation"> Coût global </label></dt>   <dd><input type="text" name="" id="" size="59" value= "1062 DT"/></dd>        </dl>                                             <dl>                        <dt><label for="upload">Upload a File:</label></dt>                        <dd><input type="file" name="upload" id="upload" /> C:/Users/Developpeur_2.CST/Downloads/a (1)</dd>                    </dl>                                        <dl>                        <dt><label for="remarque">Observations:</label></dt>                        <dd><textarea name="remarque" id="comments" rows="5" cols="36">                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                Intervention termin�e                                                                                                                                                                    </textarea></dd>                    </dl>                                        <dl>                        <dt><label></label></dt>                                            </dl>                                        <dl class="submit">                    <input type="submit" name="BtModif" id="submit" value="Enregistrer" />     <input type="reset" value="Annuler" name="B2"></center></p>                     </dl>                </fieldset>                      </form>         </div>                  </div><!-- end of right content-->                                  </div>   <!--end of center content -->                                                                   <div class="clear"></div>    </div> <!--end of main content-->         <div class="footer">         <div class="left_footer">IN ADMIN PANEL | Powered by <a href="[http://indeziner.com%22 http://indeziner.com" rel="nofollow noopener noreferrer" target="_blank"|nofollow]>INDEZINER</a></div>     <div class="right_footer"><a href="[http://indeziner.com%22 http://indeziner.com" rel="nofollow noopener noreferrer" target="_blank"|nofollow]><img src="images/indeziner_logo.gif" alt="" title="" border="0" /></a>
</div>        
</div>
</div>  
</body>
</html>

EDIT : Ajout du langage dans les balises de code (histoire d'avoir la couleur.....)

Messages postés
2371
Date d'inscription
lundi 11 février 2013
Statut
Membre
Dernière intervention
13 janvier 2021
444
Le problème semble venir d'un problème de syntaxe html :
Tu as une balise <fieldset> ouverte juste après la balise <form> qui est fermé avant le label "Tâches réalisées:", or tu as également une autre fermeture de ce </fieldset> juste avant la fermeture du form.
Tu peux donc supprimer le </fieldset> qui se trouve avant le label "Tâches réalisées:".

Il semble que tu as également une balise </center> toute seule après l'input type reset, à supprimer également (cette balise est obsolète d'ailleurs).

Idéalement, utilise le validateur W3C pour corriger les erreurs html : https://validator.w3.org/
Tu pourrais éventuellement passer à HTML5 pour corriger plus facilement ton document (pas sur que ce soit plus simple, à tester) :
https://developer.mozilla.org/fr/docs/Web/HTML/Introduction_to_HTML5
Messages postés
127
Date d'inscription
lundi 31 octobre 2016
Statut
Membre
Dernière intervention
20 juin 2017

Merci infiniment Pitet :)