Simplification page avec boucle

Fermé

nicdu40 Messages postés 25 Date d'inscription jeudi 18 novembre 2010 Statut Membre Dernière intervention 24 février 2020 - Modifié le 24 févr. 2020 à 11:49
nicdu40 Messages postés 25 Date d'inscription jeudi 18 novembre 2010 Statut Membre Dernière intervention 24 février 2020 - 24 févr. 2020 à 17:41

Bonjour, je suis sur un projet de domotique avec micro contrôleurs , ....
je peux piloter des relais a partir d'une page html qui m'affiche les températures , ....
En fait tout fonctionne mais j'aimerais simplifier ma page html car j'ai 32 sorties à piloter et j'aimerais savoir si il y aurais possibilité d' inclure des boucles for... Si quelqu’un aurait une piste ... Merci, je joins ma page avec juste 4 sorties mais en réalité il y en a 32.

<!DOCTYPE html>
<html>
<head> 
<script src="jquery-3.3.1.min.js"></script>


<script>
$(document).ready(function() {

/////////////////////1///////////////  
$("#on1").click(function(){
 var ID = "on";
 var out = "01";
 $.ajax({
  url: "/cgi-bin/ajax/stackCGI/control-all.py",
  type: "POST",
  data: { 'data_id': ID , 'data_out': out },
  success: function(response){
   $("#resultat1").html(response);
  }
 });
                   
})
               
$("#auto1").click(function(){
 var ID = "auto";
 var out = "01";
 $.ajax({
  url: "/cgi-bin/ajax/stackCGI/control-all.py",
  type: "POST",
  data: { 'data_id': ID , 'data_out': out },
  success: function(response){
   $("#resultat1").html(response);
  }
 });
})
                
$("#off1").click(function(){
 var ID = "off";
 var out = "01";
 $.ajax({
  url: "/cgi-bin/ajax/stackCGI/control-all.py",
  type: "POST",
  data: { 'data_id': ID , 'data_out': out },
  success: function(response){
   $("#resultat1").html(response);
  }
 });
})

////////////////////2///////////////  
$("#on2").click(function(){
 var ID = "on";
 var out = "02";
 $.ajax({
  url: "/cgi-bin/ajax/stackCGI/control-all.py",
  type: "POST",
  data: { 'data_id': ID , 'data_out': out },
  success: function(response){
   $("#resultat2").html(response);
  }
 });
                   
})
               
$("#auto2").click(function(){
 var ID = "auto";
 var out = "02";
 $.ajax({
  url: "/cgi-bin/ajax/stackCGI/control-all.py",
  type: "POST",
  data: { 'data_id': ID , 'data_out': out },
  success: function(response){
   $("#resultat2").html(response);
  }
 });
})
                
$("#off2").click(function(){
 var ID = "off";
 var out = "02";
 $.ajax({
  url: "/cgi-bin/ajax/stackCGI/control-all.py",
  type: "POST",
  data: { 'data_id': ID , 'data_out': out },
  success: function(response){
   $("#resultat2").html(response);
  }
 });
})

/////////////////////3///////////////  
$("#on3").click(function(){
 var ID = "on";
 var out = "03";
 $.ajax({
  url: "/cgi-bin/ajax/stackCGI/control-all.py",
  type: "POST",
  data: { 'data_id': ID , 'data_out': out },
  success: function(response){
   $("#resultat3").html(response);
  }
 });
                   
})
               
$("#auto3").click(function(){
 var ID = "auto";
 var out = "03";
 $.ajax({
  url: "/cgi-bin/ajax/stackCGI/control-all.py",
  type: "POST",
  data: { 'data_id': ID , 'data_out': out },
  success: function(response){
   $("#resultat3").html(response);
  }
 });
})
                
$("#off3").click(function(){
 var ID = "off";
 var out = "03";
 $.ajax({
  url: "/cgi-bin/ajax/stackCGI/control-all.py",
  type: "POST",
  data: { 'data_id': ID , 'data_out': out },
  success: function(response){
   $("#resultat3").html(response);
  }
 });
})

/////////////////////4///////////////  
$("#on4").click(function(){
 var ID = "on";
 var out = "04";
 $.ajax({
  url: "/cgi-bin/ajax/stackCGI/control-all.py",
  type: "POST",
  data: { 'data_id': ID , 'data_out': out },
  success: function(response){
   $("#resultat4").html(response);
  }
 });
                   
})
               
$("#auto4").click(function(){
 var ID = "auto";
 var out = "04";
 $.ajax({
  url: "/cgi-bin/ajax/stackCGI/control-all.py",
  type: "POST",
  data: { 'data_id': ID , 'data_out': out },
  success: function(response){
   $("#resultat4").html(response);
  }
 });
})
                
$("#off4").click(function(){
 var ID = "off";
 var out = "04";
 $.ajax({
  url: "/cgi-bin/ajax/stackCGI/control-all.py",
  type: "POST",
  data: { 'data_id': ID , 'data_out': out },
  success: function(response){
   $("#resultat4").html(response);
  }
 });
})

})
</script>
</head>
    
<style type="text/css">
<!--
div#data {
    background-color: rgba(255,255,255,0.9);
}
div {
    background-color: rgba(255,255,255,0.6);
}
button {
    background-color: rgba(255,255,255,0.9);
}
</style>


<div class="excontainer">
<div id="data"></div>
<br /> 
<div> out1 </div>
 <button id="on1" >on</button>
 <button id="auto1" >auto</button>
 <button id="off1" >off</button>
  <div id="1"></div>
  
<div class="excontainer">
<div id="resultat1"></div> 
</div>
<br /> 

<div> out2 </div>
 <button id="on2" >on</button>
 <button id="auto2" >auto</button>
 <button id="off2" >off</button>
  <div id="2"></div>

<div class="excontainer">
<div id="resultat2"></div>
</div>
<br />

<div> out3 </div>
 <button id="on3" >on</button>
 <button id="auto3" >auto</button>
 <button id="off3" >off</button>
  <div id="3"></div>

<div class="excontainer">
<div id="resultat3"></div>
</div>
<br />

<div> out4 </div>
 <button id="on4" >on</button>
 <button id="auto4" >auto</button>
 <button id="off4" >off</button>
  <div id="4"></div>
<div class="excontainer">
<div id="resultat4"></div>
</div> 
<br /> 


<script>
$(document).ready(function() {
 $.ajaxSetup ({
        cache: false
    });
 $("#data").load("Last.php");
    var refreshId = setInterval(function() {
        $("#data").load("Last.php");
    }, 500);
    
 
 $("1").load("etat/etat-1");
    var refreshId = setInterval(function() {
  $("#1").load("etat/etat-1");
    }, 500);
    
 $("#2").load("etat/etat-2");
    var refreshId = setInterval(function() {
  $("#2").load("etat/etat-2");
    }, 500);

 $("#3").load("etat/etat-3");
    var refreshId = setInterval(function() {
  $("#3").load("etat/etat-3");
    }, 500);
    
 $("#4").load("etat/etat-4");
    var refreshId = setInterval(function() {
  $("#4").load("etat/etat-4");
    }, 500);
        
});
</script> 

</body>
</html>

Configuration: Linux / Firefox 73.0

A voir également:

Simplification page avec boucle
Supprimer une page word - Guide
Page d'accueil iphone - Guide
Traduire une page web - Guide
Créer une page facebook - Guide
Word numéro de page 1/2 - Guide

1 réponse

Réponse 1 / 1

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
24 févr. 2020 à 06:58

Bonjour
Je ne vois pas de code java dans ce que tu nous montres...
Que du JavaScript. Une erreur dans le choix du forum ??

KX Messages postés 16734 Date d'inscription samedi 31 mai 2008 Statut Modérateur Dernière intervention 24 avril 2024 3 015
24 févr. 2020 à 11:48

Bonjour,

J'ai redirigé vers le bon forum, j'en ai profité pour ajouter la coloration syntaxique...

nicdu40 Messages postés 25 Date d'inscription jeudi 18 novembre 2010 Statut Membre Dernière intervention 24 février 2020 1 > KX Messages postés 16734 Date d'inscription samedi 31 mai 2008 Statut Modérateur Dernière intervention 24 avril 2024
24 févr. 2020 à 17:41

merci ;)

Discussions similaires

[PIX] Commencer chaque poème sur une nouvelle page

Mon pc s'allume et s'éteint en boucle

[référencement] Ne pas être référencé

Redémarrage en boucle Xiamo mi note 10

Discussions similaires

Newsletters