Posez votre question Signaler

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

Messages postés
494
Date d'inscription
lundi 24 août 2009
Statut
Membre
Dernière intervention
18 août 2019
 - - Dernière réponse : jordane45
Messages postés
26504
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
15 octobre 2019
 - 26 mai 2018 à 16:46
Javascript / DHTML Posez votre question Signaler
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

        
        

            
    
    
            

                    

                            


                    Signaler
            
                Commenter la réponse de jordane45
        
        

                

    

    

                    

                
            

                        
            
            
                

                                                
Messages postés

                            
26504

                                                
Date d'inscription

                        
mercredi 22 octobre 2003

                                            
Statut

                        
Modérateur
                        
Dernière intervention

                        
15 octobre 2019

                                    

            
        
                    316            
                        
                    
                
            

    


        

        
        


            
0

            
Merci

                            

                    
                

                    


            


    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
                                    Commenter la réponse de msi79
                                

                        

        


        

            
                        

                

    

                    
                            
            
                msi79            
            
                

                                                
Messages postés

                            
494

                                                
Date d'inscription

                        
lundi 24 août 2009

                                            
Statut

                        
Membre
                        
Dernière intervention

                        
18 août 2019

                                    

            
        
                    -
                        
        

        
        
        
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
                                    Commenter la réponse de msi79
                                

                        

        


        

            
                        

                

    

                    
                            
            
                msi79            
            
                

                                                
Messages postés

                            
494

                                                
Date d'inscription

                        
lundi 24 août 2009

                                            
Statut

                        
Membre
                        
Dernière intervention

                        
18 août 2019

                                    

            
        
                    -
                        
        

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

                

                    



                    

                        

        
        

                        
            

            

                
                        


                            Signaler
                                    Commenter la réponse de jordane45
                                

                        

        


        

            
                        

                        

                
            

                            
                            
            
                jordane45            
            
                

                                                
Messages postés

                            
26504

                                                
Date d'inscription

                        
mercredi 22 octobre 2003

                                            
Statut

                        
Modérateur
                        
Dernière intervention

                        
15 octobre 2019

                                    

            
        
                    316            
                    -
                        
        

        
        
        
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
                                    Commenter la réponse de msi79
                                

                        

        


        

            
                        

                

    

                    
                            
            
                msi79            
            
                

                                                
Messages postés

                            
494

                                                
Date d'inscription

                        
lundi 24 août 2009

                                            
Statut

                        
Membre
                        
Dernière intervention

                        
18 août 2019

                                    

            
        
                    -
                        
        

        
        
        
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
                                    Commenter la réponse de jordane45
                                

                        

        


        

            
                        

                        

                
            

                            
                            
            
                jordane45            
            
                

                                                
Messages postés

                            
26504

                                                
Date d'inscription

                        
mercredi 22 octobre 2003

                                            
Statut

                        
Modérateur
                        
Dernière intervention

                        
15 octobre 2019

                                    

            
        
                    316            
                    -
                        
        

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

                

                    



                

                    

                        

                                

                    

                        

                            Commenter la réponse de jordane45
                            
                        

                    

                    
                


            

                        

                        

        

        
        
        
    

                    
            Répondre        
                        
                Posez votre question