1. Accueil
  2. Forum Codes-Sources
  3. Javascript / DHTML

Mise à jour à partir d'un champ input type texte

Signaler
Messages postés
498
Date d'inscription
lundi 24 août 2009
Statut
Membre
Dernière intervention
1 mars 2020
 -
Messages postés
29793
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
21 octobre 2020
 -
Bonjour,
j'aimerais faire des modifications en m'inspirant d'un code qui marche bien mais jusque le ca marche pas .
A partir d'une table j'arrive a bien faire les modifiaction dans une table. Vous m'avez bien aidé ici.
Cette fois je voudrai appliquer cela en utilisant un champ input de type texte.

I.
partie HTML qui fonctionne bien 
<td style="background-color:#CC3; text-align:center; font-size:18px;"  contenteditable="true" id="<?php echo $resultat["id_art"]; ?>" name="articleQuant" ><?php echo $resultat["articleQuant"]; ?></td>


partie sa partie javascript 


son code PHP

<script> 
$(document).ready(function() 
{  
 $("td").click(function()  
  { 
   if( $(this).attr("contenteditable") == "true") 
   {    
    // le"id" du td doit contenir l'id de la BDD 
    // le "name" doit contenir le nom du champ à modifier 
     
                var contenu_avant = $(this).text(); 
                var id_bdd = $(this).attr("id"); 
                var champ_bdd = $(this).attr("name"); 
    //alert("avant =" + contenu_avant); 
                 
    $(this).blur(function() 
        { 
         var contenu_apres = $(this).text(); 
           //alert("contenu apres = " + contenu_apres); 
         
        if (contenu_avant != contenu_apres) { 
		//alert("contenu apres = " + contenu_apres); 
		  var parametre = {id:id_bdd,champ:champ_bdd,contenu:contenu_apres} ; 
		 // alert(JSON.stringify(parametre)) ; 
		  $.ajax({ 
			url: "invoice_dynamic_table/UpdatedynamiqueTmpArt.php",  
			type: "POST",  
			data: parametre,  
			success: function(html) { 
			 // console.log(html);    
			 // alert(id_bdd); 
			} ,
			error: function(xhr, status, error) {
			  console.log('error ajax');
			  console.log(error);
			  var err = eval("(" + xhr.responseText + ")");
			  alert(err.Message);
			}
		   }); 
		  } 
          
        }); 
     
   };     
             
  }); 
});   

   
</script>




Partie PHP qui fonctionne bien

<?php  
//http://codes-sources.commentcamarche.net/
 include('../functions/bdd.php');
  $id = ($_POST["id"]);  
  $champ=($_POST["champ"]);  
  $contenu=($_POST["contenu"]);  
  $table="tmp_articles";

   try {
    $conn = new PDO("mysql:host=$serveur;dbname=$base", $admin, $mdp);
    // set the PDO error mode to exception
    $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

  echo  $sql = "UPDATE $table SET $champ = '$contenu' WHERE id_art = $id "; 

    // Prepare statement
    $stmt = $conn->prepare($sql);

    // execute the query
    $result = $stmt->execute();
   /* if($result):
       $sqls = "UPDATE $table SET $champ = '$contenu' WHERE id = $id "; 

      // Prepare statement
      $stmts = $conn->prepare($sqls);

      // execute the query
      $stmts->execute();
    endif;*/
    }
catch(PDOException $e)
    {
    echo $sql . "<br>" . $e->getMessage();
    }
  // mysql_close($link); 
  // 
   echo "success"; 
  // fin accès à la base de données 
   
  // début de simulation -> écriture dans le fichier 'simulation.txt' 
  $trace = "id= ".  $id. " champ= ".  $champ . "  contenu= " . $contenu."\n"; 
  $monfichier = fopen("simulation.txt", "a"); 
  fputs($monfichier, $trace); 
  fclo






j'ai essayé avec 



<input type="number" style="text-align: center;" name="articleQuant" placeholder='Enter Qty' class="form-control qty" step="0" min="0" value="<?php echo $resultat["articleQuant"];  ?>" contenteditable="true" id="<?php echo $resultat["id_art"]; ?>" />




je pensais que en remplaçant 

 $("td").click(function()


 par :

 $("input").click(function()
ça allait marcher mais rien



je voudrais de l'aide svp    

            

            
                Afficher la suite            
        

            
            

                    

            


    



            


                                        

                                                        

                                                            

                                                            
1 réponse

                                                    

                        
                            


        
        

        

                        Réponse 1 / 1
        

                

                

        

                            
                    

                    

        
    


        

                

                
    
        

                            
Messages postés

                

                                29793
                

                                        
Date d'inscription

                
mercredi 22 octobre 2003

                                        
Statut

                
Modérateur

                                        
Dernière intervention

                
21 octobre 2020

                    

    

                                338
    

                    

                    
                        

    


    

                        
                    Bonsoir,

Une fois de plus... il faut essayer de lire entre les lignes pour comprendre ta question....

Je vais me hasarder à ça :

Tu souhaites que la maj se fasse lorsque tu quitte le champ text ou au fur et à mesure que tu saisie quelquechose dedans ?



Cas 1 

https://www.w3schools.com/tags/ev_onblur.asp



Cas 2 

https://www.w3schools.com/tags/ev_onkeyup.asp



Et bien entendu... il faut pouvoir cibler l'input à traiter.

Pour ça, tu peux par exemple utiliser une de ces class

$('.qty').tontrigger....



tontrigger etant à remplacer par l'un des deux choix que je t'ai proposé au dessus.



Bien entendu... si jamais ça ne fonctionnait pas... il faudrait commencer par regarder dans la console de ton navigateur ce qui s'y affiche. et retirer les commentaires des lignes de ton success

success: function(html) { 
  console.log(html);    
  alert(id_bdd); 
} ,





 
                        
                
                

    
            

                            

                        

    
    
    


                    

                        

                    


            Afficher les 13 commentaires
    

        
        
        
        
        
        
        
        
        

            

                                    
            
            

                
                


    

        
    Signaler
            

    
        

    


    
    

                

                
    
        

                            
Messages postés

                

                                498
                

                                        
Date d'inscription

                
lundi 24 août 2009

                                        
Statut

                
Membre

                                        
Dernière intervention

                
 1 mars 2020

                    

    



    


    





    Quand je fais CTR + U ou inspecter ca m'envoie sur une autre page qui n'affiche rien.

dc j'ai compié le code :

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <!-- This file has been downloaded from Bootsnipp.com. Enjoy! -->
    <title>Invoice Dynamic Table - Bootsnipp.com</title>
        <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet">
    <style type="text/css">
        
    </style>
    <script src="//code.jquery.com/jquery-1.12.4.js" ></script>
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
    <?php include('invoice_dynamic_table_js.php'); ?>
    
    <script>
function popupCenter(url, title, w, h, t) {
var left = (screen.width/2)-(w/2);
var top = (screen.height/2)-(h/2);
return window.open(url, title, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+t+', left='+left);
} 
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script> 
$(document).ready(function() 
{  
 $("input").keydown(function()  
  { 
   if( $(this).attr("contenteditable") == "true") 
   {    
    // le"id" du td doit contenir l'id de la BDD 
    // le "name" doit contenir le nom du champ à modifier 
     
                var contenu_avant = $(this).text(); 
                var id_bdd = $(this).attr("id"); 
                var champ_bdd = $(this).attr("name"); 
	
      alert("avant =" + contenu_avant); 
                 
    $(this).blur(function() 
        { 
         var contenu_apres = $(this).text(); 
           alert("contenu apres = " + contenu_apres); 
         
        if (contenu_avant != contenu_apres) { 
		alert("contenu apres = " + contenu_apres); 
		  var parametre = {id:id_bdd,champ:champ_bdd,contenu:contenu_apres} ; 
		  alert(JSON.stringify(parametre)) ; 
		  $.ajax({ 
			url: "invoice_dynamic_table/UpdatedynamiqueTmpArt.php",  
			type: "POST",  
			data: parametre,  
			success: function(html) { 
			  console.log(html);    
			   alert(id_bdd); 
			} ,
			error: function(xhr, status, error) {
			  console.log('error ajax');
			  console.log(error);
			  var err = eval("(" + xhr.responseText + ")");
			  alert(err.Message);
			}
		   }); 
		  } 
          
        }); 
     
   };     
             
  }); 
});   

   
</script> 
</head>
<body>
<div class="container">



  <div class="row clearfix">
    <div class="col-md-12">
      <form  id="form" class="form-horizontal form-label-left" method="post" action="">
      <div class="row clearfix" style="margin-top:20px">
    
      <?php include('total_table.php') ?>

      </div>
      <table class="table table-bordered table-hover" id="tab_logic" width="50%">
        <thead>
          <tr style="font-size: 28px; font-weight: bold;">
            <th class="text-center" width="2%"> # </th>
             <th class="text-center" width="2%"> </th>
            <th class="text-center" width="25%"> Designation </th>
            <th class="text-center" width="5%">Réf</th>
            <th class="text-center" width="5%"> Qte </th>
            <th class="text-center" width="5%"> </th>
            <th class="text-center" width="5%"> Prix </th>
            <th class="text-right" width="10%"> Total </th>
          </tr>
        </thead>
        <tbody>
        <?php
		  $rang = 0;
			foreach($resultats AS $resultat): 
		  $rang++;
		?>
          <tr id='addr0'>
            <td align="center"><?= $rang;  ?></td>
            <td align="center"><a href="supprimer/suppr_tmp_article_i3.php?id=<?= $resultat["id_art"];  ?>&clef=<?= $_GET['clef'];  ?>">
          <span class="glyphicon glyphicon-trash"></span>
        </a></td>
            <td><input type="text" name='product[]'  placeholder='Enter Product Name' class="form-control" value="<?= $resultat["articleVendu"];  ?>"/></td>
            <td><input type="text" name='ref[]'  placeholder='Enter Réference' class="form-control" value="<?= $resultat["id_prod"];  ?>/<?= $resultat["articleRef"];  ?>"/></td>
            
            
             
  <td ><input type="number" style="text-align: center;" name="articleQuant" placeholder='Enter Qty' class="form-control qty" step="0" min="0" value="<?php echo $resultat["articleQuant"];  ?>" contenteditable="true" id="<?php echo $resultat["id_art"]; ?>" /></td>
         
              <!--  
            <td style="background-color:#CC3; text-align:center; font-size:18px;"  contenteditable="true" id="<?php echo $resultat["id_art"]; ?>" name="articleQuant" ><?php echo $resultat["articleQuant"]; ?></td>
        
           -->   
            <td align="center"><a onclick="popupCenter('invoice_dynamic_table/modifQte.php?id_art=<?php echo $resultat["id_art"]; ?>', 'myPop1',600,500,100);" href="javascript:void(0);"><span class="glyphicon glyphicon-list-alt"></span></a></td>
            <td><input type="number" name='price[]' placeholder='Enter Unit Price' class="form-control price text-center" step="0.00" min="0" value="<?php echo $resultat["articlePU"];  ?>"/></td>
            <td><input type="number" name='total[]' placeholder='0.00' class="form-control total text-right" value="<?php echo  number_format($resultat["articlePU"] * $resultat["articleQuant"], 0, ',', '. ');  ?>" readonly style="font-weight: bold; font-size: 28px;" /></td>
          </tr>
       <?php
			endforeach;
		?>
          <tr id='addr1'></tr>
        </tbody>
      </table>
    </div>
  </div>

  
     </form>
    </div>
  </div>
</div>
<script type="text/javascript">
$(document).ready(function(){
    var i=1;
    $("#add_row").click(function(){b=i-1;
      	$('#addr'+i).html($('#addr'+b).html()).find('td:first-child').html(i+1);
      	$('#tab_logic').append('<tr id="addr'+(i+1)+'"></tr>');
      	i++; 
  	});
    $("#delete_row").click(function(){
    	if(i>1){
		$("#addr"+(i-1)).html('');
		i--;
		}
		calc();
	});
	
	$('#tab_logic tbody').on('keyup change',function(){
		calc();
	});
	$('#tax').on('keyup change',function(){
		calc_total();
	});
	

});

function calc()
{
	$('#tab_logic tbody tr').each(function(i, element) {
		var html = $(this).html();
		if(html!='')
		{
			var qty = $(this).find('.qty').val();
			var price = $(this).find('.price').val();
			$(this).find('.total').val(qty*price);
			
			calc_total();
		}
    });
}

function calc_total()
{
	total=0;
	$('.total').each(function() {
        total += parseInt($(this).val());
    });
	$('#sub_total').val(total.toFixed(2));
	tax_sum=total/100*$('#tax').val();
	$('#tax_amount').val(tax_sum.toFixed(2));
	$('#total_amount').val((total-tax_sum).toFixed(2));
}
</script>
</body>
</html>


    


            

                    

        

        

            

                                    
            
            

                
                


    

        
    Signaler
            

    
        

    


    
    

                

                
    
        

                            
Messages postés

                

                                498
                

                                        
Date d'inscription

                
lundi 24 août 2009

                                        
Statut

                
Membre

                                        
Dernière intervention

                
 1 mars 2020

                    

    



    


    





    
alert("avant =" + contenu_avant);
 et apres retourne tjrs rien
    


            

                    

        

        

            

                                    
            
            

                
                


    

        
    Signaler
            

    
        

        
    


    
    

                

                
    
        

                            
Messages postés

                

                                29793
                

                                        
Date d'inscription

                
mercredi 22 octobre 2003

                                        
Statut

                
Modérateur

                                        
Dernière intervention

                
21 octobre 2020

                    

    

                                338
    



    


    





    
Quand je fais CTR + U ou inspecter ca m'envoie sur une autre page qui n'affiche rien.

dc j'ai compié le code 


Tu fais CTRL + U  ... dans ton navigateur internet lorsque tu affiches la page....hein ???

Par ce que... je veux voir le code source "généré" et non celui qui contient ton php !

Et puis.. je t'ai donné un code... pourquoi ne l'as tu pas mis sur ta page ???
    


            

                    

        

        

            

                                    
            
            

                
                


    

        
    Signaler
            

    
        

    


    
    

                

                
    
        

                            
Messages postés

                

                                498
                

                                        
Date d'inscription

                
lundi 24 août 2009

                                        
Statut

                
Membre

                                        
Dernière intervention

                
 1 mars 2020

                    

    



    


    





    enfin j'ai pu recuperer le code source




 
<!DOCTYPE html>
<html>
<head>
    <title>FACTURA - CAISSE ET GESTION DE STOCK</title>
    <meta charset="utf8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="description" content="DJIGUIYA SIGNATURE SARL a �t� cr�e pour r�pondre aux besoins de l�Afrique en mati�re de contribution � l�am�lioration de la s�curit� routi�re et de la fluidit� du trafic mais aussi � la r�alisation d�am�nagements urbains et routiers durables." />
    <link rel="icon" type="image/png" href="images/icon.gif" />
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js?ver=1.4.2"></script>
    <script src="js/login.js"></script>

</head>
<body >

<div id='content' >



<!DOCTYPE html >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans titre</title>
<script type="text/javascript"> 
function focus() 
  { 
  document.getElementById('text1').focus() 
  } 
</script>
  <style>
    h1{
      text-align: center;
    }
    #modalCheck{
      display: none;
    }
    .modalLayer{
      display: none;
      position: fixed;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background-color: rgba(0, 0, 0, 0.5);
    }
    #modalCheck:checked + .modalLayer, #modalContent:target{
      display: block;
    }
    .popup_block{
      background: #fff;
      padding: 20px;
      border: 20px solid #ddd;
      position: relative;
      margin: 10% auto;
      width: 70%;
      box-shadow: 0px 0px 20px #000;
      border-radius: 10px;
      z-index: 1000000000000
    }
    img.btn_close {
      float: right;
      margin: -55px -55px 0 0;
      cursor: pointer;
    }
    .button{
      cursor: pointer;
      color: blue;
      text-decoration: underline;
    }
	 
  </style>
   <style type="text/css">
        @import url("https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.11.2/css/bootstrap-select.min.css");
		.largeur{
		width:600px; font-size:36px;
		}
    </style>
    <script>
function popupCenter(url, title, w, h) {
var left = (screen.width/2)-(w/2);
var top = (screen.height/2)-(h/2);
return window.open(url, title, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);
} 
</script>
</head>

<body style="background-color:#FFF">

<div class="row">
 <div class="col-md-2" style="color:#CC6; font-size:40px; font-weight:bold; font-style:italic; padding-left:120px">
  <a href="index.php?page=ACCUEIL" class="btn btn-default btn-lg">
          <span class="glyphicon glyphicon-circle-arrow-left"></span> RETOUR
        </a>
 </div>
  <div class="col-md-2" style="color:#CC6; font-size:40px; font-weight:bold; font-style:italic; padding-left:120px">
<a href="index.php?page=ACCUEIL&nv=1" class="btn btn-info btn-lg">
          <span class="glyphicon glyphicon-refresh"></span> NOUVEAU
        </a>

 </div>

     <div >

   
    <div class="modalLayer" id="modalContent" style="z-index: 1000000000000">
      <div class="popup_block">
        <a href="#noWhere"><img alt="Fermer" title="Fermer la fenêtre" class="btn_close" src="menu/modalbox2/close_pop.png"></a>
      
        <h2 style="color: red; font-weight: bold;">LISTE DES FACTURES EN COURS</h2>
                        <table width="100%" border="0">
                      <tr>
                        <td width="10%"><span class="badge">1</span></td>
                        <td width="30%">2018-05-26 09:56:30</td>
                        <td width="30%">ace01ATU</td>
                        <td width="15%"><a href="index.php?page=NOUVEAU&clef_att=ace01ATU">ouvrir»</a></td>
                        <td width="15%"><a href="supprimer/suppr_att.php?clef=ace01ATU"><img src="images/corbeille.png" width="20" height="20" /></a></td>
                      </tr>
                    </table>
                            
      </div>
    </div>
  </div>   <div class="col-md-2" style="color:#CC6; font-size:40px; font-weight:bold; font-style:italic; padding-left:120px">

    <a href="#modalContent"   class="btn btn-danger">En Attente <span class="badge">1</span></a> 


 </div>
 
  <div class="col-md-2" style="color:#CC6; font-size:40px; font-weight:bold; font-style:italic; padding-left:120px">
   <span style="color:#900">FACTURA</span>
 </div>

 <div class="col-md-2" style="color:#CC6; font-size:40px; font-weight:bold; font-style:italic; padding-left:120px">
   
<a onclick="popupCenter('inerfaces/venteCaissiere.php', 'myPop1',960,600);" href="javascript:void(0);">PIT</a>
 </div>

  <div class="col-md-2" style="text-align:right; font-size:24px; padding-right:140px">
   <span class="glyphicon glyphicon-user" aria-hidden="true"></span> <span style="color:#900">msi79</span>
 </div>
</div>
<div class="row">
 <div class="col-md-9">
       <form id="monformulaire"  name="form1" method="post" action="" >
    <table width="100%" border="0">
      <tr>
        <td width="45%"> </td>
        <td width="55%"> </td>
      </tr>
      <tr>
        <td> </td>
        <td> </td>
      </tr>
      <tr>
        <td style=" padding-left:100px">
                <input type="text" name="code" id="text1"  style="background-color:#850000; color:white; font-size:36px; font-weight:bold; width:500px; border-radius:25px; text-align:center;"  placeholder='Enter Code :  0014525'/>
                </td>
        <td><input type="submit" name="valider"  class="btn btn-danger btn-lg" value="VALIDER LE CODE" /></td>
      </tr>
    </table>
    </form>
 </div>
  <div class="col-md-3">
    <img src="images/orchestra_caisse.png" width="100" height="100" />
  </div>
</div>

<table width="100%" border="0">
  <tr>
    <td> </td>
    <td> </td>
  </tr>
  <tr>
    <td>
   
    </td>
    <td> </td>
  </tr>
  <tr>
    <td style="padding-left:120px"></td>
    <td> </td>
  </tr>
  <tr>
    <td>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <!-- This file has been downloaded from Bootsnipp.com. Enjoy! -->
    <title>Invoice Dynamic Table - Bootsnipp.com</title>
        <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet">
    <style type="text/css">
        
    </style>
    <script src="//code.jquery.com/jquery-1.12.4.js" ></script>
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
    <script type="text/javascript">
/* <![CDATA[ */
function mensualite()
{
k = document.forms['form'].elements['mtremi'].value;
t = document.forms['form'].elements['sub_total'].value;
n = document.forms['form'].elements['monnai_remi'].value;
r = document.forms['form'].elements['total_amount'].value;
	if(r!=0){
			                j=k-n;
							m=j-r;
							m=Math.floor(m*100)/100;
							if(m>=0){
								    	document.forms['form'].elements['avoir'].value = m;
									}else{
								           document.forms['form'].elements['avoir'].value = 0;
							             }
			}else{
				 if(n!=''){
							j=k-n;
							m=j-t;
							m=Math.floor(m*100)/100;
							if(m>=0){
								    	document.forms['form'].elements['avoir'].value = m;
									}else{
								           document.forms['form'].elements['avoir'].value = 0;
							             }
						  }
							else
							{
							document.forms['form'].elements['avoir'].value = '';
							}
				}
 }
/* ]]> */
</script>

<script type="text/javascript">
/* <![CDATA[ */
function mensualites()
{
k = document.forms['form'].elements['mtremi'].value;
t = document.forms['form'].elements['sub_total'].value;
x = document.forms['form'].elements['monnai'].value;
r = document.forms['form'].elements['total_amount'].value;
if(r!=''){
	    x=k-r;
		x=Math.floor(x*100)/100;
		document.forms['form'].elements['monnai'].value = x;
	}else
if(t!='')
{
x=k-t;
x=Math.floor(x*100)/100;
document.forms['form'].elements['monnai'].value = x;
}
else
{
document.forms['form'].elements['monnai'].value = '';
}
}
/* ]]> */
</script>
<!-- **********************************                      ********************************** --><!-- ****************************************CALCUL DE POURCENTAGE********************************** -->
<!-- **********************************                      ********************************** -->
<script type="text/javascript">
/* <![CDATA[ */
function mensualitees()
{

e = document.forms['form'].elements['sub_total'].value;
f = document.forms['form'].elements['remise'].value;//testresutat
if(f!='')
{
g=e*f/100;
z=e-g;
h=Math.floor(z*100)/100;
document.forms['form'].elements['total_amount'].value = h;

}
else
{
document.forms['form'].elements['total_amount'].value = '';
}
}
/* ]]> */
</script>
<script language="javascript">
function ouvre_popup(page) {
window.open(page,"nom_popup","menubar=no, status=no, scrollbars=yes,  width=2480, height=3508");
}
</SCRIPT>    
    <script>
function popupCenter(url, title, w, h, t) {
var left = (screen.width/2)-(w/2);
var top = (screen.height/2)-(h/2);
return window.open(url, title, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+t+', left='+left);
} 
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script> 
$(document).ready(function() 
{  
 $("input").keydown(function()  
  { 
   if( $(this).attr("contenteditable") == "true") 
   {    
    // le"id" du td doit contenir l'id de la BDD 
    // le "name" doit contenir le nom du champ à modifier 
     
                var contenu_avant = $(this).text(); 
                var id_bdd = $(this).attr("id"); 
                var champ_bdd = $(this).attr("name"); 
	
      alert("avant =" + contenu_avant); 
                 
    $(this).blur(function() 
        { 
         var contenu_apres = $(this).text(); 
           alert("contenu apres = " + contenu_apres); 
         
        if (contenu_avant != contenu_apres) { 
		alert("contenu apres = " + contenu_apres); 
		  var parametre = {id:id_bdd,champ:champ_bdd,contenu:contenu_apres} ; 
		  alert(JSON.stringify(parametre)) ; 
		  $.ajax({ 
			url: "invoice_dynamic_table/UpdatedynamiqueTmpArt.php",  
			type: "POST",  
			data: parametre,  
			success: function(html) { 
			  console.log(html);    
			   alert(id_bdd); 
			} ,
			error: function(xhr, status, error) {
			  console.log('error ajax');
			  console.log(error);
			  var err = eval("(" + xhr.responseText + ")");
			  alert(err.Message);
			}
		   }); 
		  } 
          
        }); 
     
   };     
             
  }); 
});   

   
</script> 
</head>
<body>
<div class="container">



  <div class="row clearfix">
    <div class="col-md-12">
      <form  id="form" class="form-horizontal form-label-left" method="post" action="">
      <div class="row clearfix" style="margin-top:20px">
    
      <div class="row">
 <div class="col-md-6">
    <table class="table table-bordered table-hover" id="tab_logic_total">
  <tbody>
    <tr>
      <th class="text-center">Total</th>
      <td class="text-center"><input type="number" name='sub_total' placeholder='0.00' class="form-control" id="sub_total" value="" readonly/ style="font-size:36px; color:#900; font-weight:bold"></td>
    </tr>
    <tr>
      <th class="text-center">Remise</th>
      <td class="text-center"><div class="input-group mb-2 mb-sm-0">
        <input type="number" class="form-control" id="tax" placeholder="0" name="remise">
        <div class="input-group-addon">%</div>
      </div></td>
    </tr>
    <tr>
      <th class="text-center">Montant Remise</th>
      <td class="text-center"><input type="number" name='tax_amount' id="tax_amount" placeholder='0.00' class="form-control" readonly/></td>
    </tr>
    <tr>
      <th class="text-center">Total TTC</th>
      <td class="text-center"><input type="number" name='total_amount' id="total_amount" placeholder='0.00' class="form-control" readonly  value="" style="font-size:36px; color:#900; font-weight:bold"/></td>
    </tr>
  </tbody>
</table>
 </div>
 
 <div class="col-md-6">
   <table class="table table-bordered table-hover">
  <tbody>
    <tr>
      <th class="text-center">Montant Reçu</th>
      <td class="text-center"><input type="text" name="mtremi" id="mtremi" style="background-color:#FFF;font-size:25px; font-weight:bold; text-align:right"    onkeyup="mensualites();" class="form-control"/></td>
    </tr>
    <tr>
      <th class="text-center">Monnai</th>
      <td class="text-center"><input type="text" name="monnai" id="monnai" style="background-color:#9F3;font-size:25px; font-weight:bold;text-align:right" class="form-control" /></td>
    </tr>
    <tr>
      <th class="text-center">Montant Rendu</th>
      <td class="text-center"><input type="text" name="monnai_remi" id="monnai_remi" onkeyup="mensualite();" style="background-color:#FFF;font-size:25px; font-weight:bold; text-align:right" class="form-control"/></td>
    </tr>
   <!--
    <tr>
      <th class="text-center">Avoir</th>
      <td class="text-center"><input type="text" name="avoir"  id="avoir" style="background-color:#FFF;font-size:25px; font-weight:bold; text-align:right" class="form-control" /></td>
    </tr>
    -->
    <tr>
      <th class="text-center">Date</th>
      <td class="text-center"><input type="text" name="date_vente"  id="date_vente" style="background-color:#FFF;font-size:16px; font-weight:bold;  text-align:center" value="26/05/2018"  class="form-control"/></td>
    </tr>
    <tr>
      <th class="text-center"><a href="supprimer/suppr_tmp_article_i3.php?id=&clef=ab0T2Uk8&st=1" class="btn btn-danger btn-lg"> <span class="glyphicon glyphicon-trash"></span> Annuler Vente </a></th>
      <td class="text-center"><input  type="submit" name="submit" class="btn btn-success btn-lg"  value="EMETTRE TICKET"></td>
    </tr>
  </tbody>
</table>
 </div>
</div>












      </div>
      <table class="table table-bordered table-hover" id="tab_logic" width="50%">
        <thead>
          <tr style="font-size: 28px; font-weight: bold;">
            <th class="text-center" width="2%"> # </th>
             <th class="text-center" width="2%"> </th>
            <th class="text-center" width="25%"> Designation </th>
            <th class="text-center" width="5%">Réf</th>
            <th class="text-center" width="5%"> Qte </th>
            <th class="text-center" width="5%"> </th>
            <th class="text-center" width="5%"> Prix </th>
            <th class="text-right" width="10%"> Total </th>
          </tr>
        </thead>
        <tbody>
                  <tr id='addr1'></tr>
        </tbody>
      </table>
    </div>
  </div>

  
     </form>
    </div>
  </div>
</div>
<script type="text/javascript">
$(document).ready(function(){
    var i=1;
    $("#add_row").click(function(){b=i-1;
      	$('#addr'+i).html($('#addr'+b).html()).find('td:first-child').html(i+1);
      	$('#tab_logic').append('<tr id="addr'+(i+1)+'"></tr>');
      	i++; 
  	});
    $("#delete_row").click(function(){
    	if(i>1){
		$("#addr"+(i-1)).html('');
		i--;
		}
		calc();
	});
	
	$('#tab_logic tbody').on('keyup change',function(){
		calc();
	});
	$('#tax').on('keyup change',function(){
		calc_total();
	});
	

});

function calc()
{
	$('#tab_logic tbody tr').each(function(i, element) {
		var html = $(this).html();
		if(html!='')
		{
			var qty = $(this).find('.qty').val();
			var price = $(this).find('.price').val();
			$(this).find('.total').val(qty*price);
			
			calc_total();
		}
    });
}

function calc_total()
{
	total=0;
	$('.total').each(function() {
        total += parseInt($(this).val());
    });
	$('#sub_total').val(total.toFixed(2));
	tax_sum=total/100*$('#tax').val();
	$('#tax_amount').val(tax_sum.toFixed(2));
	$('#total_amount').val((total-tax_sum).toFixed(2));
}
</script>
</body>
</html>
</td>
    <td></td>
  </tr>
</table>
<script type="text/javascript"> document.monforrmuilaire.search.focus(); </script>

<script type="text/javascript">
      window.onload=function(){
     // $('.selectpicker').selectpicker();


/*      // scrollYou
      $('.scrollMe .dropdown-menu').scrollyou();

      prettyPrint();
      };*/
    </script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.11.2/js/bootstrap-select.min.js">
    </script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.11.2/js/i18n/defaults-fr_FR.min.js"></script>

<script type="text/javascript">
$(function() {
	"use strict";
	var self = null;
	
	var Website = {};
	Website.Components = {};
	
	
	Website.Components.FormImage = {
	    init : function(){
	        self.initSelectHandler();
	        self.initAddAlbumHandler();
	    },
	    initSelectHandler : function (){
	        $('#choose-album').on('changed.bs.select', function (e, clickedIndex, newValue, oldValue) {
                  // do something...
                  console.log(e)
                  console.log(clickedIndex)
                  console.log(newValue)
                  console.log(oldValue)
            });
	    },
	    initAddAlbumHandler : function(){
	        $('#add-album-valid-button').click(function(){
	           	$('#choose-album').append($('<option>', {
                    value: 'D',
                    text: $('#album-title').val()
                })); 
	        });
	    }
	};
	self = Website.Components.FormImage; 
	
	Website.Components.FormImage.init();
});
}
</script>
</body>
</html>


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

    


            

                    

        

        

            

                                        
                        
            
            

                
                


    

        
    Signaler
            

    
        

        
    


    
    

                

                
    
        

                            
Messages postés

                

                                29793
                

                                        
Date d'inscription

                
mercredi 22 octobre 2003

                                        
Statut

                
Modérateur

                                        
Dernière intervention

                
21 octobre 2020

                    

    

                                338
    



    


    





    Je dois être aveugle.. je ne vois pas ton champ articleQuant
    


            

                    

        

        

        

    

        

            
        

    

    

    

                


                
    
    
                    

                    

                                                            
            Répondre        
                                        
            Posez votre question