IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Conception Web Discussion :

Bouton switch HTML / PHP


Sujet :

Conception Web

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre averti
    Inscrit en
    Novembre 2012
    Messages
    50
    Détails du profil
    Informations forums :
    Inscription : Novembre 2012
    Messages : 50
    Par défaut Bouton switch HTML / PHP
    Bonjour,

    Je me permet de faire appel à votre aide car j'essaie de faire un bouton de type switch sur ma page WEB mais je rencontre quelques problèmes.

    J'ai pris pour exemple le bouton suivant : https://proto.io/freebies/onoff/, en effet quand je reprend le code j'ai bien mon bouton sur ma page mais ce que je voudrais faire c'est en fonction d'une variable par exemple si $variable=1 alors mon bouton soit sur le mode ON et si $variable=0 alors mon bouton est sur OFF.
    J'ai également essayé ce bouton : http://www.scriptol.fr/html5/bouton-on-off.php mais comment le forcer à on ou off ?

    Second problème je voudrais effectuer une action en fonction de l'état du bouton ; exemple
    • Si bouton passe à off alors j'exécute une commande
    • Si le bouton passe à on alors j'exécute une autre commande



    Cela fait un moment que je cherche mais je n'y arrive pas, et n'étant pas du tout expert en JS ca devient vite compliqué pour moi.

    Auriez vous quelques pistes svp ?

    Merci par avance pour votre aide

  2. #2
    Modérateur
    Avatar de Vil'Coyote
    Homme Profil pro
    Développeur adélia & Web
    Inscrit en
    Février 2008
    Messages
    4 583
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 44
    Localisation : France, Isère (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur adélia & Web
    Secteur : Industrie

    Informations forums :
    Inscription : Février 2008
    Messages : 4 583
    Par défaut
    à mon sens ce n'est pas html / php mais html/javascript/php

    du coup il faudrait plus t'orienter javascript pour le changement de status de ton bouton et vers l'ajax si tu souhaite enclencher une action sans envoi de formulaire.
    la vie n'est pas cirrhose des foies ...

    Avant de poster un message Rechercher n'est pas qu'une option.
    FAQ Web - Tuto Web

  3. #3
    Membre averti
    Inscrit en
    Novembre 2012
    Messages
    50
    Détails du profil
    Informations forums :
    Inscription : Novembre 2012
    Messages : 50
    Par défaut
    En effet c'est bien du PHP / HTML et JS, voici mon code :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    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
    <?php
    $variable="0";
    ?>
    <html>
    
    <head>
     <link rel="stylesheet" type="text/css" href="sheet.css">
    <script>
    
    
    
    var buttonstate=1;
    function onoff(element)
    {
      buttonstate= 1 - buttonstate;
      var blabel, bstyle, bcolor;
    
     window.alert(buttonstate);
      if(buttonstate)
      {
        blabel="on";
        bstyle="green";
        bcolor="lightgreen";
      }
      else
      {
        blabel="off";
        bstyle="lightgray";
        bcolor="gray";
      }
      var child=element.firstChild;
      child.style.background=bstyle;
      child.style.color=bcolor;
      child.innerHTML=blabel;
    }
    </script>
    </head
    
    <body>
     <button class="onoff" onclick="onoff(this)"><div>off</div></button>
    
    <input type="checkbox" name="checkbox" value="checkbox" <?php if ($variable == 1) { echo "checked"; }?> >
    </body>
    
    </html>
    Comme vous pouvez le remarquer, j'ai ma variable $variable qui est égale soit à 0 doit à 1 et je voudrais que selon sa valeur soit le bouton (onoff) est positionné sur ON ou sur OFF.

    Dans le cas où le bouton est sur off et que je passe à ON je voudrais que ca effetue des actions derriéres.

    Comment puis-je faire avec ce code ?

    Cordialement

  4. #4
    Modérateur
    Avatar de Vil'Coyote
    Homme Profil pro
    Développeur adélia & Web
    Inscrit en
    Février 2008
    Messages
    4 583
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 44
    Localisation : France, Isère (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur adélia & Web
    Secteur : Industrie

    Informations forums :
    Inscription : Février 2008
    Messages : 4 583
    Par défaut
    tu utilise onchange tu appel un fonction javascript qui va vérifier la valeur de ton objet et qui effectuera l'appel ajax éventuel si ton traitement à réaliser est en php ou le traitement si tu le fait en javascript.
    la vie n'est pas cirrhose des foies ...

    Avant de poster un message Rechercher n'est pas qu'une option.
    FAQ Web - Tuto Web

Discussions similaires

  1. [Mail] Variable de PHP --> mail en HTML --> PHP
    Par JeanMi66 dans le forum Langage
    Réponses: 3
    Dernier message: 09/12/2005, 19h46
  2. [HTML][PHP] Formulaire impossible de récupérer les variables
    Par Pfeffer dans le forum Balisage (X)HTML et validation W3C
    Réponses: 1
    Dernier message: 11/11/2005, 16h08
  3. [FLASH MX2004] Création de boutons avec données php
    Par joesature dans le forum Flash
    Réponses: 1
    Dernier message: 06/10/2005, 13h06
  4. [HTML][PHP] Les liens href...
    Par hackrobat dans le forum Balisage (X)HTML et validation W3C
    Réponses: 2
    Dernier message: 31/03/2005, 11h28

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo