dom: Mittels Checkbox Input-Feld ändern

SELF-Forum

Mittels Checkbox Input-Feld ändern

dom
– Informationen zu den Bewertungsregeln

Hallo,

folgendes Script:

<html>
<head>
  <SCRIPT language="JavaScript">
   <!--
    var sort = 0;
    function Sort()
    {
 sort++;
    document.e.sortid1.value = sort;
    }

//-->
  </SCRIPT>
</head>

<body>

<form name="e">
<table>
<tr>
<td class="tabsqlh" width="50" align="center"><input type="checkbox" name="id1" value="1" onClick="Sort()"></input></td>
<td class="tabsqlh" width="10" align="center"><input type="text" size="2" name="sortid1"></input></td>
</tr>
<tr>
<td class="tabsqlh" width="50" align="center"><input type="checkbox" name="id2" value="1" onClick="Sort()"></input></td>
<td class="tabsqlh" width="10" align="center"><input type="text" size="2" name="sortid2"></input></td>
</tr>
</table>
</form>

</body>
</html>

Es soll je nach gewählter Checkbox auch das passende Input-Feld gefüllt werden - dabei ist die Anzahl der Checkboxen und Input-Felder nicht vorher definiert, sondern wird dynamisch aus der Datenbank ermittelt ...

Hat jemand eine Idee? Sorry, hab von Javascript nicht wirklich viel Ahnung :-)

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Mittels Checkbox Input-Feld ändern

    Sebastian Becker
    – Informationen zu den Bewertungsregeln

    Hallo, dom,

    versuchs mal so ...

    Grüße,

    Sebastian

    <html>
    <head>
      <SCRIPT language="JavaScript">
       <!--
    var sort1 = 0;
    var sort2 = 0;

    function Sort(checkbox)
    {
    if(checkbox==1) {
    sort1++;
    document.e.sortid1.value = sort1;
    }
    if(checkbox==2) {
    sort2++;
    document.e.sortid2.value = sort2;
    }

    }

    //-->
      </SCRIPT>
    </head>

    <body>

    <form name="e">
    <table>

    <tr>
    <td class="tabsqlh" width="50" align="center"><input type="checkbox" name="id1" value="1" onClick="Sort(1)"></input></td>
    <td class="tabsqlh" width="10" align="center"><input type="text" size="2" name="sortid1"></input></td>
    </tr>

    <tr>
    <td class="tabsqlh" width="50" align="center"><input type="checkbox" name="id2" value="1" onClick="Sort(2)"></input></td>
    <td class="tabsqlh" width="10" align="center"><input type="text" size="2" name="sortid2"></input></td>
    </tr>

    </table>
    </form>

    </body>
    </html>

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. Mittels Checkbox Input-Feld ändern

      wahsaga Homepage des Autors
      – Informationen zu den Bewertungsregeln

      hi,

      function Sort(checkbox)
      {
      if(checkbox==1) {
      sort1++;
      document.e.sortid1.value = sort1;
      }
      if(checkbox==2) {
      sort2++;
      document.e.sortid2.value = sort2;
      }

      damit hast du seine zusatz-anforderung -

      dabei ist die Anzahl der Checkboxen und Input-Felder nicht vorher definiert, sondern wird dynamisch aus der Datenbank ermittelt ...

      aber nicht sehr befriedigend umgesetzt ...

      (ausserdem würde sich dafür bei noch mehr checkboxen eher ein switch anbieten, anstatt mehrere ifs zu verwenden.)

      aber wenn du schon eine nummer an die funktion übergibst, wäre es doch praktisch, aus dieser gleich den namen des input-feldes zusammenzusetzen,
      var feldname = "sortid" + checkbox;

      zugriff auf das formularfeld dieses namens dann so, wie es http://selfhtml.teamone.de/javascript/objekte/elements.htm#allgemeines im ersten beispiel beschreibt.

      und falls für sort wirklich mehrere variablen nötig sind (auch wenn ich das aus dem eingangspost nicht herauslesen kann), würde sich statt

      var sort1 = 0;
      var sort2 = 0;
      ...
      sort1++;
      sort2++;

      eher ein array anbieten, auf das mit dem übergebenen parameter als index zugegriffen wird.

      gruss,
      wahsaga

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. Mittels Checkbox Input-Feld ändern

        dom
        – Informationen zu den Bewertungsregeln

        vielen dank für die anregungen - jetzt hab ich es verstanden :-) nachfolgendes script erfüllt alle meine vorher genannten anforderung und zusätzlich:

        • wird die checkbox deaktiviert, dann wird das intput-feld geleert
        • reset aller felder

        <html>
        <head>
          <SCRIPT language="JavaScript">
           <!--
            var sort = 0;

        function Reset()
            {
         var count = sort;
         sort = 0;
             for(var i = 0; i <= count; i++)
              {
              document.forms[i].reset();
              }
            }

        function Sort(formular)
            {
            if(document.forms[formular].elements[0].checked == false)
             {
             document.forms[formular].elements[1].value = "";
             }
         else
          {
          sort++;
             document.forms[formular].elements[1].value = sort;
             }
            }

        //-->
          </SCRIPT>
        </head>

        <body>

        <form name="1">
        <table>
        <tr>
        <td class="tabsqlh" width="50" align="center"><input type="checkbox" name="id" value="1" onClick="Sort(0)"></input></td>
        <td class="tabsqlh" width="10" align="center"><input type="text" size="2" name="sortid1"></input></td>
        </tr>
        </form>
        <form name="1">
        <tr>
        <td class="tabsqlh" width="50" align="center"><input type="checkbox" name="id" value="1" onClick="Sort(1)"></input></td>
        <td class="tabsqlh" width="10" align="center"><input type="text" size="2" name="sortid2"></input></td>
        </tr>
        </table>
        </form>
        <input type="button" value="Reset" onClick="Reset()">
        </body>
        </html>

        also haut rein ...

        Beitrag melden
        –
        Informationen zu den Bewertungsregeln