Axel Müller: <div id=wahl>Wert</div> - Wert wechseln?

Hallo,

ich bastel nun ein wenig mit dhtml

wenn ein Ergebnis kommt wird der "wahl" ausgeblendet aber ist es auch möglich was zwischen den div tag stehenden Wert als Variable zu ändern? Sonst habe ich den einen div tag eingeblendet und einen anderen eingeblendet vielleicht geht es auch noch kürzer in dem ich "Wert" ändere? Aber wie?

<div id=wahl>Wert</div>

und so rufe ich in meiner javascript funktion mein div tag auf:

var x = document.getElementById("wahl");
x.style.display = "none";

  1. Hallo,

    aber ist es auch möglich was zwischen den div tag stehenden Wert als Variable zu ändern?
    <div id=wahl>Wert</div>

    ^id="wahl"

    Ja, das geht.
    http://selfhtml.teamone.de/javascript/objekte/node.htm#node_value

    viele Grüße

    Axel

    1. Hallo,

      aber ist es auch möglich was zwischen den div tag stehenden Wert als Variable zu ändern?
      <div id=wahl>Wert</div>
              ^id="wahl"

      Ja, das geht.
      http://selfhtml.teamone.de/javascript/objekte/node.htm#node_value

      viele Grüße

      Axel

      Oh ja super!

      nur nun habe ich noch das Problem das id="wahl in ein array schreiben muß...?

      kann ich die div tags auch nach elements[i] abfragen?
      z.B. wenn ich value=true ist soll JA oder NEIN ausgegeben werden

      Momentan mache ich das so:
      document.getElementById("wahl").firstChild.nodeValue = "JA" ;

      document.getElementById("wahl").firstChild.nodeValue = "NEIN" ;

      Nur bei mehrern Datensätzen geht das auch wieder nicht mehr...

      1. Hallo,

        nur nun habe ich noch das Problem das id="wahl in ein array schreiben muß...?
        kann ich die div tags auch nach elements[i] abfragen?
        z.B. wenn ich value=true ist soll JA oder NEIN ausgegeben werden

        Kannst Du das bitte nochmal so formulieren, dass man es auch verstehen kann? So verstehe ich es nämlich nicht.

        Momentan mache ich das so:

        Für alle Elemente im Array elements führe aus, indem Zähler i von 0 bis Länge des Arrays elements jeweils um 1 erhöht wird http://selfhtml.teamone.de/javascript/sprache/schleifen.htm#for http://selfhtml.teamone.de/javascript/objekte/array.htm#length:
          Wenn das Array-Element elements[i]==true, dann [link:http://selfhtml.teamone.de/javascript/sprache/bedingt.htm#if_else}:

        document.getElementById("wahl").firstChild.nodeValue = "JA" ;

        sonst:

        document.getElementById("wahl").firstChild.nodeValue = "NEIN" ;

        viele Grüße

        Axel

        1. Hallo!

          Danke erstmal für die Links der Funktionen aber soweit war ich auch schon vorher.

          Also mein Code sieht so aus:

          <script type="text/javascript">
           <!--

          function check_all()
           {
             var a_liste = document.auswahl;
             var len = a_liste.elements.length;
             for (var i = 0; i < len; i++)
               {
             if (document.forms[0].elements[i].disabled != true)
              {
              document.forms[0].elements[i].checked = true;
              document.getElementById("wahl").firstChild.nodeValue = "JA" ;
              }
             //document.forms[0].all_del.checked = false;

          }

          }
           //-->
           </script>

          <?php
          echo '<form name="auswahl" method="post" action="'.$PHP_SELF.'">';

          echo '<input type="checkbox" name="nummer[0]" value="1"> <div id=wahl>Nein</div><br>';
          echo '<input type="checkbox" name="nummer[1]" value="4"> <div id=wahl>JA</div><br>';
          echo '<input type="checkbox" name="nummer[2]" value="66" disabled> <div id=wahl>(deaktiviert)</div><br>';
          echo '<input type="checkbox" name="nummer[3]" value="68"> <div id=wahl>Nein</div><br>';

          echo '<input name="all_check" type="checkbox" onClick="check_all()"> Alle auswählen
             <input type="image"  type="submit" name="aendern" src="bild.gif" border="0" width="225" height="20">';
          echo '</form>';
          ?>

          Wenn ich nun auf den Button klicke wird nur das erste JA geändert.
          Aber die anderen wohlen sich einfach nicht ändern?

          Ich habe auch schon <div id=wahl[0]> [...] <div id=wahl[1]> [...]
          und in der Funktion es document.getElementById("wahl")[i].firstChild.nodeValue = "JA" ; geschrieben aber das geht erst gar nicht.

          Ich weiß nicht was ich falsch mache?

          1. Hallo,

            for (var i = 0; i < len; i++)
                 {
               if (document.forms[0].elements[i].disabled != true)
                {
                document.forms[0].elements[i].checked = true;
                document.getElementById("wahl").firstChild.nodeValue = "JA" ;

            ^Das ergibt bei jedem Schleifendurchlauf immer wieder das selbe Element.

            }
            <div id=wahl>Nein</div>
            <div id=wahl>JA</div>
            <div id=wahl>(deaktiviert)</div>
            <div id=wahl>Nein</div>

            ^Eine ID muss in jedem Dokument _eindeutig_ sein.

            Wenn ich nun auf den Button klicke wird nur das erste JA geändert.

            Nein, es wird bei jedem Schleifendurchlauf wieder das Element mit der id="wahl" verändert. Das ist das erste Element, welches mit dieser ID notiert wurde.

            Aber die anderen wohlen sich einfach nicht ändern?

            Wie auch. Welche Elemente sollen sich denn ändern? Das hier: <div id=wahl>(deaktiviert)</div> auch?

            Ich habe auch schon <div id=wahl[0]> [...] <div id=wahl[1]> [...]
            und in der Funktion es document.getElementById("wahl")[i].firstChild.nodeValue = "JA" ; geschrieben aber das geht erst gar nicht.

            Nein, so geht es nicht.

            So:

            <div id="wahl1">Nein</div>
            <div id="wahl2">JA</div>
            <div id="wahl3">(deaktiviert)</div>
            <div id="wahl4">Nein</div>

            und

            document.getElementById("wahl" + i).firstChild.nodeValue = "JA" ;

            würde gehen.

            viele Grüße

            Axel

            1. Hallo

              So:

              <div id="wahl1">Nein</div>
              <div id="wahl2">JA</div>
              <div id="wahl3">(deaktiviert)</div>
              <div id="wahl4">Nein</div>

              und

              document.getElementById("wahl" + i).firstChild.nodeValue = "JA" ;

              würde gehen.

              Also das funktioniert leider auch nicht es wird folgende Zeile als Fehler (Obejekt erforderlich)angemeckert:

              document.getElementById("wahl" + i).firstChild.nodeValue = "JA" ;

              1. Hallo,

                Also das funktioniert leider auch nicht es wird folgende Zeile als Fehler (Obejekt erforderlich)angemeckert:

                document.getElementById("wahl" + i).firstChild.nodeValue = "JA" ;

                Bei welchem Wert für i? Bzw. gibt es das Element mit der ID ("wahl" + i), also "wahl0", "wahl1", "wahl3", ... "wahl10" ... ?

                viele Grüße

                Axel

                1. Hallo,

                  Also das funktioniert leider auch nicht es wird folgende Zeile als Fehler (Obejekt erforderlich)angemeckert:

                  document.getElementById("wahl" + i).firstChild.nodeValue = "JA" ;
                  Bei welchem Wert für i? Bzw. gibt es das Element mit der ID ("wahl" + i), also "wahl0", "wahl1", "wahl3", ... "wahl10" ... ?

                  was meinst Du?

                  ich habe es nun so geändert mußte das div Tag so ändern:
                  <div id=wahl[0]> ... <div id=wahl[1]> ...

                  Dann habe ich es in der JavaScript Funktion auf:
                  document.getElementById('wahl['+i+']').firstChild.nodeValue = "JA" ;

                  dann geht es aber es kommt trotzdem ein JavaScript-Fehler: Obejekt erforderlich und wieder die besagte Zeile:

                  document.getElementById('wahl['+i+']').firstChild.nodeValue = "JA" ;

                  Zu der Frage ob die Zeile (deaktiviert) auch geändert werden soll?
                  Eigentlich nicht aber das kann ich später noch durch eine If Abfrage ausgrenzen.

                  1. Ich habe nun weiter gebastelt und was anderes ausprobiert was auch funktioniert nur es kommt wieder diese Fehlermeldung?

                    Also das Ergebnis von "alter Code" und "neuer Code" ist der selbe!
                    Ich frage mich nur welches Objekt nicht gefunden werden kann? Kann ich diesen Fehler nicht irgendwie unterdrücken?

                    Also so sieht mein Quellcode nun aus:

                    <script type="text/javascript">
                     <!--

                    function check_all()
                     {
                       var a_liste = document.auswahl;
                       var len = a_liste.elements.length;
                       for (var i = 0; i < len; i++)
                         {
                       if (document.forms[0].elements[i].disabled != true)
                        {
                        document.forms[0].elements[i].checked = true;

                    }
                      // neuer Code
                        var Text = "JA";
                       var rd_Start = 0;
                       var rd_Laenge = document.getElementById('wahl'+i).firstChild.nodeValue.length;
                       document.getElementById('wahl'+i).firstChild.replaceData(rd_Start,rd_Laenge,Text);

                    // alter Code
                       //document.getElementById('wahl'+i).firstChild.nodeValue="JA";
                       }

                    }
                     //-->
                     </script>

                    <?php
                    echo '<form name="auswahl" method="post" action="'.$PHP_SELF.'">';

                    echo '<input type="checkbox" name="nummer[0]" value="1"> <div id=wahl1>Nein</div><br>';
                    echo '<input type="checkbox" name="nummer[1]" value="4"> <div id=wahl2>JA</div><br>';
                    echo '<input type="checkbox" name="nummer[2]" value="66" > <div id=wahl3>(deaktiviert)</div><br>';
                    echo '<input type="checkbox" name="nummer[3]" value="68"> <div id=wahl4>Nein</div><br>';

                    echo '<input name="all_check" type="checkbox" onClick="check_all()"> Alle auswählen
                       <input type="image"  type="submit" name="aendern" src="bild.gif" border="0" width="225" height="20">';
                    echo '</form>';
                    ?>

                    1. <script type="text/javascript">
                       <!--

                      function check_all()
                      {
                         var a_liste = document.auswahl;
                         var len = a_liste.elements.length;
                         for (var i = 0; i < len; i++)
                           {
                         if (document.forms[0].elements[i].disabled != true)
                          {
                          document.forms[0].elements[i].checked = true;

                      }
                        // neuer Code
                          var Text = "JA";
                         var rd_Start = 0;
                         var rd_Laenge = document.getElementById('wahl'+i).firstChild.nodeValue.length;
                         document.getElementById('wahl'+i).firstChild.replaceData(rd_Start,rd_Laenge,Text);

                      // alter Code
                         //document.getElementById('wahl'+i).firstChild.nodeValue="JA";
                         }

                      }
                       //-->
                       </script>

                      Das ist total umständlich du kannst der Funktion bereits die Referenz auf das Formular mit geben.
                      echo '<input name="all_check" type="checkbox" onClick="check_all(this.form)"> Alle auswählen';

                      und damit:
                      function check_all(form)
                      {
                      var len = form.elements.length;

                      for (var i = 0; i < len; i++)
                       if (!form.elements[i].disabled)
                         form.elements[i].checked = true;

                      dein 'neuer' Code ist ganz seltsam:

                      // neuer Code
                          var Text = "JA";
                         var rd_Start = 0;
                         var rd_Laenge = document.getElementById('wahl'+i).firstChild.nodeValue.length;

                      was ist denn i hier?
                      und selbst wenn i einen gültigen Wert besäße solltest du immer (erst recht wenn du ein Skript entwickelst), die Wert ptüfen die du verwenden möchtest.
                      (ich weiß ja nicht wie du das in PHP machst, abereigentlich sollte man das Wissen wenn man programmiert)

                      var rd_Laenge = document.getElementById('wahl'+i);
                      if(rd_Laenge)
                       return alert('Es trat ein Fehler auf. konnte ' + i + ' nicht finden');

                      re_Laenge = rd_Laenge.firstChild.nodeValue.length;

                      usw.

                      Struppi.