[JS/CSS] form-element niet weergegeven in <div> - Softwareontwikkeling

woensdag 21 november 2001 15:10

Acties:

🚴‍♂️

Topicstarter

Ik stuit net op een leuke bug (?) van NS4:
Ik heb een form, met daarin een checkbox. Als mensen die hebben aangevinkt, moet er een layer verschijnen met daarin nog 3 andere checkboxes. Wordt hij weer afgevinkt, dan verdwijnt de layer en worden de checkboxes op die layer ook afgevinked, zodat ze niet meegepost worden naar het form.

Gaat prima in IE, maar NS geeft de checkboxes in die layer dan niet weer. Waarschijnlijk verwachten de checkboxes nog een <form>-tag in dezelfde container (die <div>), maar die staat daaromheen en dus zegt NS: heel fijn, maar ik ga die dingen dus niet weergeven. Wanneer ik de style-properties van de layer weghaal (position, top, left, z-index & visibility), dan geeft hij ze wel weer.
Het probleem is dat alleen dat die layer dan geen properties meer heeft, en die kan ik dan ook niet meer aanpassen met JS.

Iemand enig idee of dit is op te lossen, en zo ja, hoe?

Dit is de (gedeeltelijke) code:

code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
    <title>site</title>
    <style type="text/css">
    <!--
      #nieuwsOptions {
        position    : relative; 
        top    : 0px;
        left      : 0px;
        z-index     : 2; 
        visibility  : visible;
      }
    -->
    </style>
    <script language="javascript" typeE="text/javascript">
    <!--
      isVisible = true;

      function toggleOptions() {
        if (document.layers)        theOptions = document.layers["nieuwsOptions"];
        if (document.all)          theOptions = document.all["nieuwsOptions"].style;
        if (document.getElementById)    theOptions = document.getElementById("nieuwsOptions").style;
        
        theOptions.visibility   = (isVisible) ? "hidden" : "visible";
        isVisible          = (isVisible) ? false : true;

        if (!isVisible) {
            formLength = document.forms[0].length - 1;
            for (i=14; i<(formLength); i++) {
              document.forms[0].elements[i].checked = false;
            }
        }
      }
    //-->
    </script>
</head>

<body onLoad="document.forms[0].elements['naam'].focus()">

<div class="tekst">
                                        
    <form method="post" action="magazine_inschrijven2.php3">
    <table border="0" cellspacing="0" cellpadding="3">
        <tr>
            <td class="tekst"><b>Naam</b></td>
            <td><input name="naam" type="text" size="30" class="invoer"></td>
        </tr>
              <!-- knip -->
        <tr>
            <td class="tekst"><b>&nbsp;</b></td>
            <td class="tekst">
                <table border="0" cellspacing="0" cellpadding="2">
                    <tr>
                        <td valign="top" class="tekst"><input name="nieuwsbrief" type="checkbox" checked="checked" onClick="toggleOptions();"></td>
                        <td valign="top" class="tekst">Ik wil mij ook inschrijven voor de nieuwsbrief per email</td>
              </tr>
              <tr>
                <td class="tekst">&nbsp;</td>
                <td class="tekst">
                    <div id="nieuwsOptions">
                      <input name="emarkOnderwerpId[]" type="checkbox" value="4" checked="checked"> onderwerp 4 <br>
                      <input name="emarkOnderwerpId[]" type="checkbox" value="5" checked="checked"> onderwerp 5 <br>
                      <input name="emarkOnderwerpId[]" type="checkbox" value="6" checked="checked"> onderwerp 6 <br>
                    </div>
                </td>
              </tr>
                </table>
             </td>
        </tr>
        <tr>
            <td class="tekst">&nbsp;</td>
            <td class="tekst"><br><input type="submit" value="Schrijf mij in!" class="button"></td>
        </tr>
    </table>
    </form>
                            
    
    
</div>

</body>
</html>

_{sorry voor layout-verneuking trouwens}

woensdag 21 november 2001 15:31

Acties:

drm

f0pc0dert

Ik zie idd dat wanneer je er 2 formpjes van maakt het wel lukt.

Eenvoudige oplossing is dan een knop met tekst submit en
onclick="form1.elements [ a ].value = form2.elements [ a ].value; (...) form1.submit"

Een andere oplossing weet ik ff niet...

Music is the pleasure the human mind experiences from counting without being aware that it is counting
~ Gottfried Leibniz

woensdag 21 november 2001 15:43

Acties:

Pelle

🚴‍♂️

Topicstarter

Daar had ik zelf dus ook al aan zitten denken; beetje een pauperoplossing dus. Heb het inmiddels anders opgelost (zonder layers):

code:

    <script language="javascript" typeE="text/javascript">
    <!--
      isChecked = true;

      function toggleOptions() {
        isChecked   = (isChecked) ? false : true;
        formLength  = document.forms[0].length - 1;
        if (!isChecked) {
            for (i=14; i<(formLength); i++) {
              document.forms[0].elements[i].checked = false;
            }
        } else {
            for (i=14; i<(formLength); i++) {
              document.forms[0].elements[i].checked = true;
            }
        }
      }
      
      function toggleNieuwsbrief() {
        if (document.forms[0].elements["nieuwsbrief"].checked == false) { 
            document.forms[0].elements["nieuwsbrief"].checked = true;
            isChecked = true;
        }
      }
    //-->
    </script>

<input name="nieuwsbrief" type="checkbox" checked="checked" onClick="toggleOptions();"> Nieuwsbrief<br>

<input name="emarkOnderwerpId[]" type="checkbox" value="4" checked="checked" onClick="toggleNieuwsbrief();"> Extended ERP<br>
<input name="emarkOnderwerpId[]" type="checkbox" value="5" checked="checked" onClick="toggleNieuwsbrief();"> CRM<br>
<input name="emarkOnderwerpId[]" type="checkbox" value="6" checked="checked" onClick="toggleNieuwsbrief();"> Portals<br>

Oftewel: klik op de nieuwsbrief-checkbox, en alles wordt aangevinkt. Als je dat ding weer uncheckt, worden alle options ook afgevinkt.
Is de nieuwsbrief afgevinkt maar vink je een onderwerp aan, dan wordt nieuwsbrief automagisch weer aangevinkt, en andersom. De enige die afgevangen wordt door m'n php-scrippie is dat men wel een nieuwsbrief wil, maar geen onderwerpen heeft aangeklikt. Kan ook met een alert(), maar dat is niet mooi.

woensdag 21 november 2001 15:46

Acties:

drm

f0pc0dert

tja, zo kan het natuurlijk ook...

Ik zou dan alleen nog 1 dingetje toevoegen:
maak de 3 checkboxjes disabled op het moment dat de "nieuwsbrief"-checkbox afgevinkt wordt.

Music is the pleasure the human mind experiences from counting without being aware that it is counting
~ Gottfried Leibniz

woensdag 21 november 2001 15:49

Acties:

Pelle

🚴‍♂️

Topicstarter

Op woensdag 21 november 2001 15:46 schreef drm het volgende:
Ik zou dan alleen nog 1 dingetje toevoegen:
maak de 3 checkboxjes disabled op het moment dat de "nieuwsbrief"-checkbox afgevinkt wordt.

Is niet nodig, want op het moment dat ik een van de onderwerpen weer aanvink, wordt de nieuwsbrief-checkbox ook automagisch weer aangevinkt. (Disabelen werkt trouwens ook niet in NS4, dus dat laten we lekker achterwege).

woensdag 21 november 2001 15:53

Acties:

drm

f0pc0dert

Op woensdag 21 november 2001 15:49 schreef Pelle het volgende:
Is niet nodig, want op het moment dat ik een van de onderwerpen weer aanvink, wordt de nieuwsbrief-checkbox ook automagisch weer aangevinkt. (Disabelen werkt trouwens ook niet in NS4, dus dat laten we lekker achterwege).

zit idd ook wat in

Music is the pleasure the human mind experiences from counting without being aware that it is counting
~ Gottfried Leibniz

woensdag 21 november 2001 15:56

Acties:

Pelle

🚴‍♂️

Topicstarter

Op woensdag 21 november 2001 15:53 schreef drm het volgende:
zit idd ook wat in

Helaas, heb ik toch nog het laatste woord

* Pelle constateert opvallend veel één-tweetjes tussen drm en Pelle vandaag

woensdag 21 november 2001 16:00

Acties:

drm

f0pc0dert

Pelle:
Helaas, heb ik toch nog het laatste woord

klopt! ... of ...?

* Pelle constateert opvallend veel één-tweetjes tussen drm en Pelle vandaag

true, true! We'd make a great team, you know

Music is the pleasure the human mind experiences from counting without being aware that it is counting
~ Gottfried Leibniz

woensdag 21 november 2001 16:14

Acties:

Pelle

🚴‍♂️

Topicstarter

Op woensdag 21 november 2001 16:00 schreef drm het volgende:
klopt! ... of ...?

Wellus!

true, true! We'd make a great team, you know

Zekers te weten.
* Pelle vraagt zich alleen af waar de andere JS-goeroe's zich vandaag bevinden: RM-rf, Clay, Blues, Annie, ..

woensdag 21 november 2001 16:20

Acties:

drm

f0pc0dert

Pelle:
* Pelle vraagt zich alleen af waar de andere JS-goeroe's zich vandaag bevinden: RM-rf, Clay, Blues, Annie, ..

misschien durven ze niet te kijken wat voor moeilijke vragen jij allemaal stelt, en houden ze zich vandaag liever bij de newbie-vragen

tenslotte vergen die niet zoveel hersenkrakerij

Music is the pleasure the human mind experiences from counting without being aware that it is counting
~ Gottfried Leibniz

woensdag 21 november 2001 16:23

Acties:

Verwijderd

Op woensdag 21 november 2001 16:20 schreef drm het volgende:
misschien durven ze niet te kijken wat voor moeilijke vragen jij allemaal stelt, en houden ze zich vandaag liever bij de newbie-vragen

tenslotte vergen die niet zoveel hersenkrakerij

ik ben ze (helaas) vandaag ok niet tegengekomen, dus tja......misschien zijn ze wel verhuisd naar een forum waar ze nog moeilijkere vragen stellen

woensdag 21 november 2001 16:24

Acties:

drm

f0pc0dert

* drm saw RM-rf just a few moments ago...

Music is the pleasure the human mind experiences from counting without being aware that it is counting
~ Gottfried Leibniz

woensdag 21 november 2001 16:29

Acties:

Woudloper

« - _ - »

misschien durven ze niet te kijken wat voor moeilijke vragen jij allemaal stelt, en houden ze zich vandaag liever bij de newbie-vragen

* Woudloper wil ook wel graag een oplossing van de andere JS goeroes voor zijn probleem:

Hoe een dynamische tabel met CSS/JS goed werkend te krijgen

woensdag 21 november 2001 16:35

Acties:

Verwijderd

Op woensdag 21 november 2001 15:10 schreef Pelle het volgende:
Ik stuit net op een leuke bug (?) van NS4:
[...]
Waarschijnlijk verwachten de checkboxes nog een <form>-tag in dezelfde container (die <div>), maar die staat daaromheen en dus zegt NS: heel fijn, maar ik ga die dingen dus niet weergeven. Wanneer ik de style-properties van de layer weghaal (position, top, left, z-index & visibility), dan geeft hij ze wel weer.
Het probleem is dat alleen dat die layer dan geen properties meer heeft, en die kan ik dan ook niet meer aanpassen met JS.

Iemand enig idee of dit is op te lossen, en zo ja, hoe?

Ja, door alle divs hun eigen form tags te geven.

Zie ook [topic=305228/1/50]

Op woensdag 21 november 2001 16:14 schreef Pelle het volgende:
* Pelle vraagt zich alleen af waar de andere JS-goeroe's zich vandaag bevinden: RM-rf, Clay, Blues, Annie, ..

Ja, ja...sommigen hier proberen tussen de posts door ook nog te werken voor de centen

donderdag 22 november 2001 07:57

Acties:

Annie

amateur megalomaan

Op woensdag 21 november 2001 16:14 schreef Pelle het volgende:

* Pelle vraagt zich alleen af waar de andere JS-goeroe's zich vandaag bevinden: RM-rf, Clay, Blues, Annie, ..

tss, laat ik een keer mensen netjes voor is het weer niet goed

btw. ik heb de andere genoemde topics niet gelezen, maar volgens mij is de reden van het gedrag van NS nog niet genoemd. En dat is wel zo handig voor de toekomstige searchers.

Eigenlijk is het kinderlijk simpel, NS4 houdt niet van form-elementen zonder <form> tags. En zoals we allemaal weten wordt een layer door NS4 ook gezien als een nieuw/los document.
Oplossing zou dus zijn om elke DIV een eigen form te geven. Bij submitten moet je dan wel met javascript de noodzakelijke waarden uit de losse div-forms overnemen in een verzamelform en deze submitten, aangezien alleen waarden uit een form wat gesubmit wordt worden gepost en je nu meerdere forms hebt waarvan er maar 1-tje gesubmit kan worden.
En (zie boven) voor NS4 worden de aanroepen van de elementen dan dus:
document.layers['layertje'].document.forms['formpje'].elements['inputje'].enz.enz

HTH.

Op woensdag 21 november 2001 16:35 schreef Blues het volgende:

Ja, ja...sommigen hier proberen tussen de posts door ook nog te werken voor de centen

true

Today's subliminal thought is:

donderdag 22 november 2001 12:07

Acties:

Pelle

🚴‍♂️

Topicstarter

Op donderdag 22 november 2001 07:57 schreef Annie het volgende:
tss, laat ik een keer mensen netjes voor is het weer niet goed

Lol

Eigenlijk is het kinderlijk simpel, NS4 houdt niet van form-elementen zonder <form> tags. En zoals we allemaal weten wordt een layer door NS4 ook gezien als een nieuw/los document.

Ja, dat kon ik er zelf ook nog wel uit opmaken. Maar het gekke is dus dat wanneer je een <div> opeens properties meegeeft, zoals position: relative, dat NS dan zegt: ja nu zie ik de form-tags eromheen niet meer, dus dan kan je de schijt krijgen.
De oplossing had ik dus ook al aan gedacht, maar ik had geen zin om voor iets zo simpels een zo omslachtige oplossing te gaan bouwen.