executer une action lors d'un click sur un bouton de page web
Bonjour à toutes et à tous,
Je suis en train de réaliser un projet mêlant programme Qt en page web. L'idée, c'est que je veux déporté mon IHM Qt sur un page web. J'ai déjà réaliser une page web pour représenter mon IHM et le programme Qt est en cours de développement (mais je n'en parlerai pas ici). Il ne me reste qu'une petit truc à faire sur ma page web et j'aurais besoin de votre aide ou de vos conseils.
Je vous donne au préalable le code .html de ma page web (je ne pense pas que vous fournir le code css vous soit utile donc je ne le posterai pas ici)
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Site de démonstration</title>
<meta name="keywords" content="simple, grid, theme, free templates, web design, one page layout, slategray, steelblue, templatemo, CSS, HTML" />
<meta name="description" content="Simple Grid is a one-page website template provided by templatemo.com" />
<link href="css/templatemo_style.css" rel="stylesheet" type="text/css" />
<script type='text/javascript' src='js/jquery.min.js'></script>
<script type='text/javascript' src='js/jquery.scrollTo-min.js'></script>
<script type='text/javascript' src='js/jquery.localscroll-min.js'></script>
<script type="text/javascript">
$(document).ready(function () {
$.localScroll();
});
</script>
</head>
<body>
<div id="templatemo_wrapper">
<div id="templatemo_header">
Site de démonstration
</div>
<!--<div id="templatmeo_menu">
<ul>
<li><a href="#home" class="home"><span></span></a></li>
<li><a href="#about" class="about"><span></span></a></li>
<li><a href="#portfolio" class="portfolio"><span></span></a></li>
<li><a href="#services" class="services"><span></span></a></li>
<li><a href="#contact" class="contact"><span></span></a></li>
</ul>
</div>-->
<div id="templatemo_main">
<div id="home" class="main_box">
<h1>Communication série entre un site web et un automate</h1>
Le but de cette page web est de servir de démonstrateur.<br/><br/>
Ce que l'on veut faire: Cette page sera hébergée sur un serveur embarqué lighttpd installé sur une carte Raspberry Pi (<a href="http://fr.wikipedia.org/wiki/Raspberry_Pi">Information sur la Raspberry Pi</a>).
Cette carte Raspberry Pi va nous permettre de commander via une communication série et une application développé sous Qt un automate.<br/><br/>
L'application développé sous Qt est une apllication nous permmettant d'établir la communication série avec l'automate, d'allumer les 8 LEDs présentent sr les sorties Tout Ou Rien de l'automate et de pouvoir
lancer un chenillard sur ces mêmes LEDs. Le programme développé sous Qt possède une IHM mais pour ce projet, nous alons que cette IHM soit dépporté sur une page web, afin de pouvoir commander l'automate de
n'importe où. Nous allons donc "recréer" ici l'IHM du programme développé sous Qt. <br/><br/>
Le programme développé sous Qt tournera donc en fond sur la carte Raspberry Pi, au même titre que l'hébergeur et cette page, via le programme Qt et la communication série nous permettra de contrôle de l'automate.
<div class="cleaner"></div>
</div> <!-- END of home -->
<div id="home" class="main_box">
<h1>L'IHM déportée</h1>
<div align="center">
<div class="two_column float_l">
<h2>Partie Connexion<br/></h2>
<input type="button" style="width:200px" value="Connexion à l'automate"><br/><br/>
<input type="button" style="width:200px" value="Démarrer la communication"><br/><br/>
<input type="button" style="width:200px" value="Quitter"><br/><br/>
</div>
<div class="two_column float_r">
<h2>Partie Gestion des LEDs</h2>
<input type="button" style="width:200px" value="Lancer le chenillard"><br/>
<input type="button" style="width:200px" value="Arrêter le chenillard"><br/><br/>
<input type="button" style="width:200px" value="LED1"><br/>
<input type="button" style="width:200px" value="LED2"><br/>
<input type="button" style="width:200px" value="LED3"><br/>
<input type="button" style="width:200px" value="LED4"><br/>
<input type="button" style="width:200px" value="LED5"><br/>
<input type="button" style="width:200px" value="LED6"><br/>
<input type="button" style="width:200px" value="LED7"><br/>
<input type="button" style="width:200px" value="LED8"><br/>
</div>
</div>
<div class="cleaner"></div>
</div>
</div> <!-- END of -->
<div id="templatemo_footer">
Copyright © 2048 Your Company Name<br /> Designed by <a href="http://www.templatemo.com" target="_parent">Free CSS Templates</a>
</div>
</div>
<script type='text/javascript' src='js/logging.js'></script>
</body>
</html> |
Comme vous pouvez le voir, j'ai différents boutons sur cette page qui me permette de réaliser différentes actions.
Pour "connecter" cette IHM web avec mon programme Qt, je souhaiterai utiliser un code qui ressemble à cela:
Code:
1
2
3
| IF ( POST['BOUTON_ALLUME_LED1'] )
exec ( "./MONPROGRAMME ALLUME_MA_LED1")
END IF |
Mais j'ai une question: comment récupérer l'action de clic de mon BOUTON_ALLUME_LED1 pour le passé dans ce code.
Pouvez-vous m'aider s'il vous plait,
Cordialement,
Clairetj
