Philipp Lenz: Form Feld aktivieren/deaktivieren

Hallo,

kann mir jemand hier sagen, wie ich bei z. B. "onChange" bei JavaScript ein Form Feld aktivieren, bzw deaktivieren kann?

Folgendes Vorhaben:

Wenn eine Checkbox angeklickt wird, also auf 'True' gestellt wird, soll ein daneben liegendes Text Feld aktiviert werden, also man kann dann erst etwas dort eingeben, ansonsten soll das Feld ausgegraut sein, oder jedenfalls keine Eingabe akzeptieren, so auf die Art wie 'readonly' bei Form-Text-Feldern.

Mfg

Philipp Lenz

  1. Hallo Phillip,

    folgender Ansatz funktioniert:

    <INPUT onfocus="javascript:blur();" TYPE="text" NAME="XYZ" value="{text()}">

    wenn du jetzt statt blur() eine Funktion aufrufst und dort abfragst, ob die entsprechende checkbox aktiviert wurde, kannst du je nach Fall
    blur ausführen.

    Gruß,
    Fraenk

    P.S. Mit Netscape nachtesten!

    1. Ja danke,

      aber kannst Du mir vielleicht auch eine Funktion geben?

      Ich komme eigentlich aus dem PHP Bereich, und habe mit JS net viel zu tun, habe auch leider noch nicht die Zeit gefunden damit was zu machen, wäre euch super dankbar wenn mir jemand eine fertige Funktion liefern könnte.

      Mfg

      Philipp Lenz

      1. Hallo beisammen!

        Bin leider gestern nicht mehr im Forum gewesen. Wenns noch jemanden interessiert:

        <html>
        <head>
        <title>Untitled Document</title>

        <script language="JavaScript">

        function isChecked()
        {

        if (document.form1.check1.checked == true)
             {
                         document.form1.text1.blur()
             }

        }

        </script>
        </head>

        <body bgcolor="#FFFFFF">
        <form method="post" action="" name="form1">
          <input type="checkbox" name="check1" value="checkbox">
          <input type="text" onfocus="javascript:isChecked();" name="text1">
        </form>
        </body>
        </html>

        Grüße,
        Fraenk

        P.S. Die Geschichten mit ...style = ... etc funktionieren in NN 4.x wohl nicht so, oder?

    2. Hallo Fraenk!

      folgender Ansatz funktioniert:

      <INPUT onfocus="javascript:blur();" TYPE="text" NAME="XYZ" value="{text()}">

      Wenn ich das richtig sehe, brauch ich nur javascript abschalten und kann dann erst recht was reinschreiben. (evtl.: Dann javascript wieder einschalten und ab geht die post.)

      Und was passiert dann?

      Grüße Sonny

      1. Wenn ich das richtig sehe, brauch ich nur javascript abschalten und kann dann erst recht was reinschreiben. (evtl.: Dann javascript wieder einschalten und ab geht die post.)

        Und was passiert dann?

        Nichts weiter, denn der jenige wird dann mit meinem PHP Script welche auf die Mütze bekommen, soll nur für die erste Seite den Menschen deutlich machen, wenn er ein Produkte zur Anfrage angeklickt hat, das er auch eine Menge angeben sollte.

        Mfg

        Philipp

  2. Hi

    -------------
    <html>

    <head>
    <script>
    function box_onclick() {
      if (document.frm_form.frm_box.checked) {
        document.frm_form.frm_text.disabled = false;
        document.frm_form.frm_text.style.backgroundColor = "white";
        document.frm_form.frm_text.style.cursor = "text";
        document.frm_form.frm_text.style.color = "black";
      }
      else {
        document.frm_form.frm_text.disabled = true;
        document.frm_form.frm_text.style.backgroundColor = "buttonface";
        document.frm_form.frm_text.style.cursor = "default";
        document.frm_form.frm_text.style.color = "#808080";
      }
    }
    </script>
    </head>

    <body style="background-color:buttonface; cursor:default;">

    <form name="frm_form">
    <input type="checkbox" name="frm_box" value="ON" onClick="box_onclick();">
    <input type="text" name="frm_text" size="20" disabled style="background-color:buttonface;cursor:default;">
    </form>

    </body>

    </html>
    ----------------

    schöne, cu
      capior

  3. hallo Philipp, gruss capior,

    ich habe auch noch ein script ausgegraben;
    es muesste aber noch an "document.getElementById"
    angepasst werden - ACHTUNG: hab das teil nur fuer
    die dose geschrieben - aber vielleicht koennen die
    zeilen ja als denkanstoss dienen:

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

    <head>
    <title>checkAndFill.html</title>
    <script language="JavaScript" type="text/javascript">
    <!--
    function checkboxClick(index)
     {var boxElement = document.forms["myForm"].elements[(index*2)];
      var inputElement = document.forms["myForm"].elements[((index*2)+1)];
      if (boxElement.checked)
      {if (document.all)
       {eval('document.all.checkbox' + index + '.className="boxChecked";');
        eval('document.all.textinput' + index + '.className="inputEnabled";');
        inputElement.disabled = false;
       }
       inputElement.focus();
      }
      if (!boxElement.checked)
      {if (document.all)
       {eval('document.all.checkbox' + index + '.className="boxUnchecked";');
        eval('document.all.textinput' + index + '.className="inputDisabled";');
        inputElement.disabled = true;
        top.focus();
       }
       if (document.layers) {inputElement.value = "";}
     } }
    function inputFocus(index)
     {var boxElement = document.forms["myForm"].elements[(index*2)];
      var inputElement = document.forms["myForm"].elements[((index*2)+1)];
      if (document.layers) {if (!boxElement.checked) {boxElement.checked = true;}}
     }
    function inputBlur(index)
     {var boxElement = document.forms["myForm"].elements[(index*2)];
      var inputElement = document.forms["myForm"].elements[((index*2)+1)];
      if (inputElement.value == "")
      {if (document.all)
       {eval('document.all.checkbox' + index + '.className="boxUnchecked";');
        eval('document.all.textinput' + index + '.className="inputDisabled";');
        boxElement.checked = false;
        inputElement.disabled = true;
        top.focus();
       }
       if (document.layers) {boxElement.checked = false;}
     } }

    function getMyStyles()
     {var myStyles = ''+
      '<st'+'yle>\n'+
      '<!'+'--\n';
      if (document.all)
      {myStyles += ''+
       '.boxUnchecked{background-color:#f5f5f5;border-style:inset;border-width:2px;width:20px;height:20px;}\n'+
       '.boxChecked{background-color:#d3d3d3;border-style:outset;border-width:2px;width:20px;height:20px;}\n'+
       '.inputDisabled{background-color:#d3d3d3;border-style:outset;width:200px;height:20px;}\n'+
       '.inputEnabled{background-color:#f5f5f5;border-style:inset;width:200px;height:20px;color:#000000;font-family:verdana,geneva,arial,helvetica,sans-serif;font-size:10px;line-height:12px;font-weight:bold;}\n';
      }
      if (document.layers)
      {var adaptSize = (11/10);
       myStyles += ''+
       '.boxUnchecked{background-color:#d3d3d3;width:' + Math.round(20*adaptSize) + 'px;height:' + Math.round(20*adaptSize) + 'px;}\n'+
       '.inputDisabled{background-color:#f5f5f5;border-style:inset;width:200px;height:' + Math.round(20*adaptSize) + 'px;color:#000000;font-family:verdana,geneva,arial,helvetica,sans-serif;font-size:' + Math.round(10*adaptSize) + 'px;line-height:' + Math.round(12*adaptSize) + 'px;font-weight:bold;}\n';
      }
      myStyles += ''+
      '/'+'/--'+'>\n'+
      '</st'+'yle>\n';
      return myStyles;
     }
    //-->
    </script>
    <script language="JavaScript" type="text/javascript">document.write(getMyStyles());</script>
    </head>

    <body>
    <table cols="1" rows="1" width="100%" height="100%" cellspacing="0" cellpadding="0" border="0">
    <tr>
     <td align="center" valign="middle">

    <form name="myForm">
     <table cols="2" rows="5" width="50" cellspacing="5" cellpadding="0" border="0">
     <tr>
      <td align="left" valign="bottom"><input type="checkbox" id="checkbox0" class="boxUnchecked" onclick="checkboxClick(0);"></td>
      <td align="left" valign="top"><input type="text" id="textinput0" class="inputDisabled" disabled onfocus="inputFocus(0);" onblur="inputBlur(0);"></td>
     </tr>
     <tr>
      <td align="left" valign="bottom"><input type="checkbox" id="checkbox1" class="boxUnchecked" onclick="checkboxClick(1);"></td>
      <td align="left" valign="top"><input type="text" id="textinput1" class="inputDisabled" disabled onfocus="inputFocus(1);" onblur="inputBlur(1);"></td>
     </tr>
     <tr>
      <td align="left" valign="bottom"><input type="checkbox" id="checkbox2" class="boxUnchecked" onclick="checkboxClick(2);"></td>
      <td align="left" valign="top"><input type="text" id="textinput2" class="inputDisabled" disabled onfocus="inputFocus(2);" onblur="inputBlur(2);"></td>
     </tr>
     <tr>
      <td align="left" valign="bottom"><input type="checkbox" id="checkbox3" class="boxUnchecked" onclick="checkboxClick(3);"></td>
      <td align="left" valign="top"><input type="text" id="textinput3" class="inputDisabled" disabled onfocus="inputFocus(3);" onblur="inputBlur(3);"></td>
     </tr>
     <tr>
      <td align="left" valign="bottom"><input type="checkbox" id="checkbox4" class="boxUnchecked" onclick="checkboxClick(4);"></td>
      <td align="left" valign="top"><input type="text" id="textinput4" class="inputDisabled" disabled onfocus="inputFocus(4);" onblur="inputBlur(4);"></td>
     </tr>
     </table>
     </form>

    </td>
    </tr>
    </table>
    </body>

    </html>

    viel spass - by(t)e by(t)e - peterS. - pseliger@gmx.net