system
July 31, 2011, 3:12pm
1
Bonjour à tous,
et oui pour changer un peu du codage Arduino (pas de soucis c'est en rapport ;p )
Donc je dispose d'un site sur lequel j'ai deux boutons, je voudrais qu'en cliquant sur l'un ou l'autre, il se connecte (on ne voit pas qu'il le fait) a l'adresse http de mon adruino, ce qui aura pour effet d'activer une partie de programme.
La partie arduino est fonctionnelle. Il y a juste la partie web que je n'arrive pas à faire.
Un peu d'aide est la bienvenue !
Merci d'avance à tous !!
Bonjour,
regarde du coté de jquery ou d'ajax
Si tu veux de l'aide pour ton code html il va falloir montrer un peu ce que tu as du coté de ta page web... comme ça c'est difficile à dire d'où proviens ton problème.
system
July 31, 2011, 4:26pm
4
tu as exactement compris mon soucis toi
skywodd:
Bonjour,
regarde du coté de jquery ou d'ajax
Tu pourrais m'aider un peu ?
Sauf que je ne gère absolument pas ajax ='(
Mais pour répondre à chesnel, voici ce qui se trouve déjà sur ma page:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Commande Maison Flajolet</title>
<style type="text/css">
body {
background-image: url(fond.jpg);
background-repeat: no-repeat;
background-position: center center;
background-attachment: fixed;
font-family: "Comic Sans MS", cursive;
}
</style>
</head>
<body>
<center><input name="Button" type="button" style="font-size:1000%" value="PC"></center>
<center><input name="Porte" type="submit" style="font-size:1000%" value="Porte"> </center>
</body>
</html>
Ajax et Jquery(qui utilise le javascript) sont des langages dynamique qui permet la communication sans à avoir recharger la page (je te le fais très résumé)
La manière dont tu abordes ton code html ne permet en rien d'envoyer des informations à ton arduino. peux-tu montrer aussi ce que tu as coté arduino ?
system
July 31, 2011, 5:05pm
6
Pour cela regarde mon autre sujet juste à côté
Mais en gros je doit taper dans mon nagivateur http://x.x.x.x :xxxx/?L1=ON et je voudrais que mon site le fasse lorsque je clique sur mon bouton =)
Nous en avons pas mal discuté sur ce post : http://arduino.cc/forum/index.php/topic,63116.15.html j'ai donner un exemple de communication avec jquery.
J'ai fait le code simplifié niveau présentation :
<!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>changement couleur arduino Client</title>
<style type="text/css">
#btn_porte{ color: white; width: 300px; height:50px; border-radius:10px; line-height: 50px; margin: 200px auto; text-align:center; cursor: pointer; font-weight: bold; font-size: 24px; text-transform: uppercase; }
</style>
<!-- chargement de la libraire jquery -->
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
<script type="text/javascript">
$(function(){
//détecte quand tu clique sur le div btn_porte
$("#btn_porte").click(function(){
//envoie par méthode POSt l'information L1 on peut utiliser aussi la méthode GET
$.post("http://ton_site_web.php/",{L1:"ON"});
});
</script>
</head>
<body>
<div id="btn_porte">PORTE</div>
</body>
</html>
Je ne l'est pas tester donc dis moi si ça fonctionne
Edit : oubliez le style css
system
July 31, 2011, 5:38pm
8
Dreamweaver me dit qu'il y a une erreur ligne 23 ? Et ne manque t'il pas le "=" après le L1 car c'est dans le programme http://x.x.x.x :xxxx/?L1=ON
sur cette ligne ?
$.post("http://ton_site_web.php/",{L1:"ON"});
non car c'est de cette manière que tu communique en post avec jquery
$.post("test.php", { name: "John", time: "2pm" } );
trouvez ici jQuery.post() | jQuery API Documentation
Test quand même malgrès l'erreur
Exact un oublie de fermeture de balise
<!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>changement couleur arduino Client</title>
<style type="text/css">
#btn_porte{ background-color: red; color: white; width: 300px; height:50px; border-radius:10px; line-height: 50px; margin: 200px auto; text-align:center; cursor: pointer; font-weight: bold; font-size: 24px; text-transform: uppercase; }
</style>
<!-- chargement de la libraire jquery -->
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
<script type="text/javascript">
$(function(){
//détecte quand tu clique sur le div btn_porte
$("#btn_porte").click(function(){
//envoie par méthode POSt l'information L1 on peut utiliser aussi la méthode GET
$.post("http://ton_site_web.php/",{L1:"ON"});
});
});
</script>
</head>
<body>
<div id="btn_porte">PORTE</div>
</body>
</html>
system
July 31, 2011, 6:35pm
12
SUPER !!! C'est fonctionnel !! Merci infiniment chesnel !!