Forum » Javascript » [JS] \"Waarschuwingsbox\"

  1. Bnc

    Hallo,

    Ik vermoed dat wat ik zoek hoogstwaarschijnlijk met javascript mogelijk moet zijn.

    Ik heb met HTML (en PHP regelt de verwerking) een formulier met tal van opties. Nu bij sommige opties zou ik een soort van waarschuwing wil weergeven. Ik leg het even uit aan de hand van een concreet voorbeeldje.

    Stel dat ik volgende HTML-code heb:

    Code
    1
    2
    3
    4
    5
    6
    7
    
    <select>
      <option>Uit</option>
      <option>Beide</option>
      <option>Enkel optie 1</option>
      <option>Enkel optie 2</option>
      <option>Beide</option>
    </select>



    Stel dat de gebruiker de optie \"Uit\" heeft geselecteerd, dan zou ik boven dat veld direct een mooi div willen geven dat deze optie niet is aangereden om de reden: blabla. Als men dan beslist om toch die optie niet te nemen en bv. \"Enkel optie 1\" selecteert, moet die kader weer weg. Ik zou dit trouwens ook op andere HTML-(input)elementen willen gebruiken (zoals een gewoon text-veld)

    Nu, ik heb geen flauw benul hoe dit zou kunnen heten / waar ik dit kan vinden. Ik hoop dus dat iemand weet hoe dit noemt / waar ik dit kan vinden.

    Alvast bedankt,
    Esli

    [Update]
    Ter verduidelijking:


    Dus als de optie uit is geselecteerd (zonder dat er gepost etc. is) moet dat rode vak verschijnen. Indien het een andere optie is, moet er gewoon niet verschijnen. Tevens moet het rode vlak weer weg gaan als er een andere optie wordt gekozen.

    Bewerkt door Bnc op wo 28-10-2009 om 21:41
    wo 28-10-2009 om 21:39
Reacties (15)

Reageren
  1. Wessletj

    wat je zou kunnen proberen is eerst controleren dmv javascript welke option is geselecteerd, als het optie 1 is doe je dmv set innerHtml (moet je maar even opzoeken) het volgende:
    Je hebt een lege div, als er een melding moet komen doe je dus innerhtml en dat zet je iets binnen die div. Wat je ook kan doen is de div er al neer zetten met tekst en dat je dmv css het stijl attribuut display aan zet (dus dat je \'m eerst verstopt met display: none; en tevoorschijn met display: block)

    Ik heb geen zin om alles voor je op te gaan zoeken dus dat zul je zelf maar moeten doen. Succes!


    guitar lessons
    wo 28-10-2009 om 21:44
  2. Tim

    Code
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    
            <select onchange=\"doCheck(this);\" id=\"selectbox\"> 
              <option>Uit</option> 
              <option selected=\"selected\">Beide</option> 
              <option>Enkel optie 1</option> 
              <option>Enkel optie 2</option> 
              <option>Beide</option> 
            </select>
            
            <div id=\"warning\" style=\"display: none; margin-top: 10px; padding: 5px; background-color: #FFC4C4; border: 1px solid; color: #CC0000;\">Deze optie is niet aanbevolen</div>
            
            <script type=\"text/javascript\">
                doCheck = function(Obj)
                    {
                        document.getElementById(\'warning\').style.display = (!Obj.selectedIndex) ? \'\' : \'none\';
                    }
            
                 doCheck(document.getElementById(\'selectbox\'));
                // checken op moment van laden ivm autocomplete reload
            </script>



    Voorbeeld

    do 29-10-2009 om 01:45
  3. Bnc

    Geweldig Tim! Bedankt!

    Ik vroeg me even af of het ook mogelijk was om hierin een soort van vertraging in te bouwen? Nu komt het namelijk \"direct\" en verdwijnt het weer \"direct\". Hoe kan ik dit doen? (Op wat moet ik eens googl\'n)

    do 29-10-2009 om 18:48
  4. Infinite

    Dmv setTimeout()

    do 29-10-2009 om 21:29
  5. Bnc

    Quote: infinite

    Dmv setTimeout()


    Dat is gewoon \"echt\" vertragen. Ik ben echt op zoek naar soort van fade-effect. Zoiets achtig als bij de messagebar. (Maar dan ook met outfade...)

    do 29-10-2009 om 21:33
  6. Fusionboy

    Moet je even 1 van de javascript libs pakken zoals jquery, kan je prima mee in en uit faden Of als je niet zo\'n hele grote lib nodig hebt kan je simpelweg even googlen naar een fade scriptje

    do 29-10-2009 om 21:38
  7. Bnc

    Ik vond dit:
    http://docs.jquery.com/Effects/show (Die onderste met button)

    Nu, als ik het goed begrijp heb ik enkel dat kleine stukje code nodig? Of heb ik meer nodig? Hoe kan ik dit trouwens dan in mijn script werken. (Ik heb weinig, [lees: geen] javascript skillz, ben enkel op zoek naar dit script, niets meer)

    do 29-10-2009 om 22:13
  8. Sarvice

    Quote: tim

    [..]

    Voorbeeld


    als ik het goed begrijp. krijgt elke optie boven de eerste \"bijde\" dus een Warning dat het niet is aanbevolen ?



    Join the Army, see the world, meet interesting people - and kill them.
    do 29-10-2009 om 22:41
  9. Bnc

    Quote: sarvice

    [..]

    als ik het goed begrijp. krijgt elke optie boven de eerste \"bijde\" dus een Warning dat het niet is aanbevolen ?


    Neen, enkel de optie uit.

    vr 30-10-2009 om 15:26
  10. Sarvice

    Quote: bnc

    [..]

    Neen, enkel de optie uit.

    waar kan ik vinden in het script welke optie hij selecteert ?

    volgens mij heb ik het.
    \'selectbox\' moet dan \'uit\' of \'bijde\' zijn. maar hoe als ik nou 2 wil hebben met die zelfde waarschuwing?

    Bewerkt door Sarvice op vr 30-10-2009 om 15:49

    Join the Army, see the world, meet interesting people - and kill them.
    vr 30-10-2009 om 15:34
  11. Tim

    Quote: fusionboy
    Moet je even 1 van de javascript libs pakken zoals jquery, kan je prima mee in en uit faden Of als je niet zo\'n hele grote lib nodig hebt kan je simpelweg even googlen naar een fade scriptje
    Ga nou eens weg met je jQuery, elke mongool kan daarmee scripten. Anders leer je het ff lekker een keer zelf...

    Ik heb em even voor je aangepast, met opacity.
    Het script hoef je maar éénmalig neer te zetten, vervolgens hoef je alleen maar op elke selectbox het onchange attribute te zetten en een div te maken met id \"id-van-selectbox:warning\", die moet worden weergegeven...
    Quote: sarvice
    waar kan ik vinden in het script welke optie hij selecteert ?

    volgens mij heb ik het.
    \'selectbox\' moet dan \'uit\' of \'bijde\' zijn. maar hoe als ik nou 2 wil hebben met die zelfde waarschuwing?
    Nee, hij geeft em alleen als de \'eerste optie\' optie is geselecteerd, onafhankelijk of deze nou \'uit\' is, of iets anders.
    Quote: bnc
    Bedankt Tim Ik zit er inderdaad aan te denken om is wat te verdiepen in JS, maar momenteel wil ik gewoon mijn huidige projecten afwerken Nogmaals dank!
    Anytime, en ik had het niet over jou, maar diegene die ik quoten. jQuery kan iedereen, het is veel beter zelf te weten wat je doet. Hier leer je dus veel meer van, al werk je maar een paar blikken op de code.

    Bewerkt door Tim op vr 30-10-2009 om 19:08
    vr 30-10-2009 om 16:51
  12. Bnc

    Quote: tim

    [..]Ga nou eens weg met je jQuery, elke mongool kan daarmee scripten. Anders leer je het ff lekker een keer zelf...

    Ik heb em even voor je aangepast, met opacity.
    Het script hoef je maar éénmalig neer te zetten, vervolgens hoef je alleen maar op elke selectbox het onchange attribute te zetten en een div te maken met id \"id-van-selectbox:warning\", die moet worden weergegeven...[..]Nee, hij geeft em alleen als de \'eerste optie\' optie is geselecteerd, onafhankelijk of deze nou \'uit\' is, of iets anders.


    Bedankt Tim Ik zit er inderdaad aan te denken om is wat te verdiepen in JS, maar momenteel wil ik gewoon mijn huidige projecten afwerken Nogmaals dank!

    vr 30-10-2009 om 17:34
  13. Sarvice

    Kan iemand mij vertellen. hoe ik zorg dat hij meerdere opties zoon balk weergeeft?.



    Join the Army, see the world, meet interesting people - and kill them.
    vr 30-10-2009 om 23:18
  14. Bnc

    //off Sarvice, open je niet beter zelf een topic? Jouw vraag dwaalt toch al enigszins af van mijn startbericht?

    vr 30-10-2009 om 23:56
  15. Sarvice

    Quote: bnc

    //off Sarvice, open je niet beter zelf een topic? Jouw vraag dwaalt toch al enigszins af van mijn startbericht?

    ik kan wel een nieuw topic maken. maar dat vind ik ook dubbelzinnig. jij hebt de basis van mijn vraag. ik wil alleen weten hoe ik meer dan 1 kan selecteren voor de error.



    Join the Army, see the world, meet interesting people - and kill them.
    za 31-10-2009 om 18:49
Reageren