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

jQuery Discussion :

Attribut onChange() sur un select


Sujet :

jQuery

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre confirmé
    Homme Profil pro
    Webdesigner
    Inscrit en
    Février 2013
    Messages
    63
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Aube (Champagne Ardenne)

    Informations professionnelles :
    Activité : Webdesigner
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Février 2013
    Messages : 63
    Par défaut Attribut onChange() sur un select
    Bonjour à toute la communauté,

    Voilà quel est mon soucis.

    Je trouve plein de codes pour afficher "une" div selon si on sélectionne une option dans le select mais ce n'est pas vraiment ce que je recherche.

    Je cherche plus à afficher différentes div selon les options choisies.

    Chaque option affichera une div différente avec un contenu différent.

    Je m'explique dans mon select j'ai plusieurs options :

    - Piller ce domaine
    - Assiéger ce domaine
    - Lancer un assaut sur ce domaine
    - Déplacer mes troupes sur ce domaine
    - Espionner ce domaine

    et selon l'option choisie, se ne sera pas le même cadre qui s'affichera en-dessous.

    Car les troupes à envoyer ne seront pas les mêmes donc j'aimerai avoir une solution à cela mais j'ai beau chercher, je ne trouve que des scripts qui affiche une seule div sur un changement avec donc, une seule fonction appelée.

    A moins qu'il soit possible de mettre une ID à chaque option et le onChange() sur chacune des options mais ne connaissant pas bien le jQuery et le JS, je préfère avoir les bonnes infos que d'y aller à taton pendant des heures ^^

    Merci de m'orienter vers une solution car là je cale un peu ^^

  2. #2
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 659
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 75
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 659
    Billets dans le blog
    1
    Par défaut
    passe par une attribution / suppression de class sur tes divs
    avec une class visible et une class hidden

    sur le .change() du select en fonction du val() du select (ou data-sur le option:selected) tu attribues les bonnes class aux divs.
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

  3. #3
    Membre confirmé
    Homme Profil pro
    Webdesigner
    Inscrit en
    Février 2013
    Messages
    63
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Aube (Champagne Ardenne)

    Informations professionnelles :
    Activité : Webdesigner
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Février 2013
    Messages : 63
    Par défaut
    val() = value de l'option j'imagine ?

    je préférerai partir sur un display:block ou un display:none plutôt que visibility.

    avec un effet de slide pour faire apparaître la div du dessous.

    cela-dit, je ne vois pas ce que tu veux dire par "Attribution / suppression" désolé j esuis une vraie bille mais j'essaye de comprendre le fonctionnement du JS en ce moment

    Aurais-tu un schema rapide d'exemple à me montrer stp ?

  4. #4
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 659
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 75
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 659
    Billets dans le blog
    1
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

  5. #5
    Membre confirmé
    Homme Profil pro
    Webdesigner
    Inscrit en
    Février 2013
    Messages
    63
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Aube (Champagne Ardenne)

    Informations professionnelles :
    Activité : Webdesigner
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Février 2013
    Messages : 63
    Par défaut
    Parfait !!! merci ^^

    http://jsfiddle.net/rwoz672a/1/

    Maintenant j'ai une autre question qui a son importance...

    je passe par un système de champs select généré par jQuery et en fait il transforme automatiquement mes balises <options> en <ul><li><a href="#"></a></li></ul>

    Est-ce que cela peut empêcher le bon déroulement des opérations si j'ajoute ce code ?

  6. #6
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 659
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 75
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 659
    Billets dans le blog
    1
    Par défaut
    ben vu que les balises li ou a n'ont pas de value ... pense à recupérer le value des options pour les passer en href des a ou en data- de tes li poru connaitre le div cible lors du click (du coup plus de onchange)
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. propriété onChange sur un select, pb sous IE7 !
    Par avogadro dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 07/02/2007, 15h46
  2. onchange sur un SELECT : passage de paramètre
    Par NikoBe dans le forum Général JavaScript
    Réponses: 8
    Dernier message: 31/10/2006, 11h14
  3. 2 actions sur evenement onchange sur champ Select
    Par falz222 dans le forum Général JavaScript
    Réponses: 1
    Dernier message: 31/08/2006, 20h59
  4. onChange sur un SELECT
    Par linar009 dans le forum Général JavaScript
    Réponses: 4
    Dernier message: 18/07/2006, 10h14
  5. [Onchange] sur checkbox selection ds une liste deroulante
    Par maxxou dans le forum Général JavaScript
    Réponses: 4
    Dernier message: 06/01/2006, 00h17

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