Soucis HTML

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 :wink:

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.

tu as exactement compris mon soucis toi :wink:

skywodd:
Bonjour,
regarde du coté de jquery ou d'ajax :wink:

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 ?

Pour cela regarde mon autre sujet juste à côté :wink:

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 :slight_smile:

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

non non celle-ci:

         </script>

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>

SUPER !!! C'est fonctionnel !! Merci infiniment chesnel !!