✔ Textfeld deaktivieren mit Javascript

Status
Nicht offen für weitere Antworten.
sh0x

sh0x

Erfahrenes Mitglied
Hello,

ich habe ein Formular mit 2 Checkboxen. Ich möchte nun, dass die Textfelder beim Laden der Seite grau hinterlegt und deaktiviert sind. Wenn man nun auf eine Checkbox klickt, aktiviert sich das dazugehörige Textfeld und bekommt einen normal weißen Hintergrund. Nun kann man reinschreiben.

Ich habe mich daran schon etwas versucht. Allerdings komme ich mit "this" durcheinander.
Habe folgenden Code im Internet gefunden und angepasst:
Code: 
<input type="checkbox" onpropertychange="document.suchform.titel.setAttribute('disabled',!getAttribute('checked'));" name="check_titel" value="check_titel" <?php echo (isset($check_titel) && $check_titel=="check_titel") ? "checked" : ""; ?>> Dokumententitel<br />
<input type="text" name="titel" size="30" maxlength="30" value="<?php echo (isset($titel)) ? $titel : ""; ?>" disabled>
Nun will ich diesen langen Code aber in einer Funktion unterbringen. Dazu müsste ich nach meinem Verständnis ja einmal das Checkbox-Objekt und das Textfeld-Objekt an die Funktion weiterreichen.
Wenn ich aber sowas mache wie:
Code: 
<input type="checkbox" onpropertychange="meinefunktion(this,'titel');" ...>
Dann gibts immer eine Fehlermeldung, dass er this nicht ansprechen kann bzw. kein Objekt ist. Ich peile das "this" ehrlich gesagt auch nicht ganz.
Damit ihr das ganze mal seht, habe ich ein Screenshot angehängt.

Ich hoffe ihr könnt mir weiterhelfen.
Lieben Gruß,
sh0x
 

Anhänge

  • form.JPG
    form.JPG
    5,9 KB · Aufrufe: 270
Hi,

wenn du es mit einer eigenen Funktion realisieren willst, könntest du folgenden Script-Abschnitt
im Header notieren:
Code: 
<script type="text/javascript">
  <!--
  function meinefunktion(objCheckbox, objTextfeld){
    objTextfeld.disabled = (objCheckbox.checked) ? false : true;
  }
  //-->
</script>
Aufgerufen wird die Routine im onclick-Event der Checkbox. Übergeben wird das Objekt des
auslösenden Objekts (this) und das Objekt, das "disabled" werden soll (this.form.feldname).
HTML: 
<form action="" method="">
  <input type="checkbox" onclick="meinefunktion(this, this.form.titel);" name="check_titel" value="check_titel"> Dokumententitel<br />
  <input type="text" name="titel" size="30" maxlength="30" value="wertvoll" disabled>
</form>
Ciao
Quaese
 
Klappt wunderbar und ist viel einfacher als mein Ansatz - danke!

Weißt du zufällig noch, wie ich die Formulare mit Javascript aufwerten könnte?

Lieben Gruß und Frohe Weihnachten :)
 
ich fänd es zum Beispiel interessant, wenn der Valuetext drinsteht, er aber verschwindet, wenn man mit der Maus hineingeht. Außerdem fände ich es gut, wenn die deaktivierten Felder einen gräulichen Hintergrund hätten, wenn sie aktiv würden dieser aber weiß würde.
Sorry für mein deutsch, bin eben aufgestanden ;)
 
Okay, nachdem das eher Kinderkram ist, fände ich es gut, wenn du mal bei selfhtml schauen würdest. Ein leerer String als value dem Feld zugewisen leert es und mit den style-Eigentschaften kannst du die Hintergrundfarbe beeinflussen. Du brauchst nur noch die ensprechenden Events.

Bitte mach dich dahingehen schlau, man muss dir ja nicht alles vorkauen und die Forensuche dürfte auch einiges ausspucken - selbst ist der Mann!
(siehe zu dem Thema den Thread "Keine Ahnung von Javascript")
 
Zuletzt bearbeitet:
Ich wollte eher Anregungen haben, was für ein gelungenes Formular mit Javascript noch realisiert werden könne. Ich wollte keine fertige Lösung haben. Das möchte ich dann selbst schreiben. Ich brauche nur Ideen, was dazu gehört, dass man sagen kann, ein Formular ist sehr benutzerfreundlich und sieht gut aus. Ich möchte mich lediglich inspirieren lassen.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück