Insertion d'une ligne d'un tableau HTML en base de données

Résolu/Fermé
abirgl Messages postés 127 Date d'inscription lundi 31 octobre 2016 Statut Membre Dernière intervention 20 juin 2017 - 14 nov. 2016 à 09:29
abirgl Messages postés 127 Date d'inscription lundi 31 octobre 2016 Statut Membre Dernière intervention 20 juin 2017 - 17 nov. 2016 à 11:58
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 :)






A voir également:

2 réponses

Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
Modifié par Pitet le 14/11/2016 à 16:38
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,
0
abirgl Messages postés 127 Date d'inscription lundi 31 octobre 2016 Statut Membre Dernière intervention 20 juin 2017
14 nov. 2016 à 16:53
Bonjour Pitet,
Je vais poster mon code via le bouton code prochainement :)
Concernant le formulaire, oui les inputs sont définis dans un formulaire avec la méthode post
<form action="ajouter.php" method="POST" class="niceform">

J'ai modifié l'attribut name de la balise input comme vous me l'avez indiqué et fermé la balise input dans le javascript, j'ai aussi modifié la récupération de l'element saisi comme suit
  $libc=$_POST['libChD'][$x];  

Mais ça n'affiche rien aussi :(
0
Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
14 nov. 2016 à 17:05
Quel est la valeur de $x dans l'instruction de ton précédent message ?

Si tu fais un var_dump($_POST); au début du traitement php du formulaire, vois tu l'ensemble des données ?
0
abirgl Messages postés 127 Date d'inscription lundi 31 octobre 2016 Statut Membre Dernière intervention 20 juin 2017
14 nov. 2016 à 17:15
$x est initialisée à 0, elle s'incrémente et s'affiche correctement, le probleme c'est avec $_POST , le var_dump($_POST) retourne un tableau vide
0
Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
14 nov. 2016 à 17:28
Si le var_dump retourne un tableau vide, c'est que le formulaire n'a envoyé aucune données.
Peux tu stp nous montrer le code source html généré de ta page (sans le code php, tu peux utiliser la fonction "Code source de la page" de ton navigateur pour nous transmettre le code html généré).
0
abirgl Messages postés 127 Date d'inscription lundi 31 octobre 2016 Statut Membre Dernière intervention 20 juin 2017
15 nov. 2016 à 11:39
Voici le code html de ma page :


<h2>Fiche d'intervention </h2>

<div class="form">
<form 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>


<form name="addForgottenTask" > <dl><dt><label for="mat">Tâches réalisées:</label> <input type="button" name="ajout_tache" onClick="AjouterTacheOublie()" 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>

<input type="hidden" id="hide" name="flag" value=$i />
<td> <input type="text" style="border:0px" name="libtache".$i value="Tache2"></td>
<td><input type="text" style="border:0px" name="coutparheuretache".$i value="100.000"></td>
<td> <input type="time" style="border:0px" name="heuredebtache".$i value="12:00" > </td>
<td> <input type="time" style="border:0px" name="heurefintache".$i value="13:30" > </td>
<td> <input type="text" style="border:0px" name="totaltache".$i value="150" > </td>


</tr>
</tbody>

<input type="hidden" id="hide" name="flag" value=$i />
<td> <input type="text" style="border:0px" name="libtache".$i value="Tache1"></td>
<td><input type="text" style="border:0px" name="coutparheuretache".$i value="200.000"></td>
<td> <input type="time" style="border:0px" name="heuredebtache".$i value="10:00" > </td>
<td> <input type="time" style="border:0px" name="heurefintache".$i value="12:00" > </td>
<td> <input type="text" style="border:0px" name="totaltache".$i value="400" > </td>


</tr>
</tbody>




</table>


<dl>
<dt><label for="mat">Articles consommés:</label> <input type="button" id="ajout_article" onClick="AjouterArticleOublie()" 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>

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

</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" rel="nofollow noopener noreferrer" target="_blank">INDEZINER</a></div>
<div class="right_footer"><a href="http://indeziner.com" rel="nofollow noopener noreferrer" target="_blank"><img src="images/indeziner_logo.gif" alt="" title="" border="0" /></a></div>

</div>

</div>
</body>
</html>


0
abirgl Messages postés 127 Date d'inscription lundi 31 octobre 2016 Statut Membre Dernière intervention 20 juin 2017
Modifié par jordane45 le 16/11/2016 à 17:09
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.....)

0
Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
17 nov. 2016 à 11:18
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
0
abirgl Messages postés 127 Date d'inscription lundi 31 octobre 2016 Statut Membre Dernière intervention 20 juin 2017
17 nov. 2016 à 11:58
Merci infiniment Pitet :)
0