seanjohn: formularfeld nach auswahl ein/ ausblenden

SELF-Forum

formularfeld nach auswahl ein/ ausblenden

seanjohn
– Informationen zu den Bewertungsregeln

Hallo,
ich möchte gerne das nach der Auswahl ( intern / extern ) die Formularfelder für die Person eingeblendet bzw. ausgeblendet werden. Kann mir jemand helfen? hier der code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Zeitungslager</title>
<style type="text/css">
<!--
.Stil1 {
 color: #800000;
 font-weight: bold;
 font-family: Verdana, Arial, Helvetica, sans-serif;
}
body {
 background-color: #D5E3D2;
}
.Stil3 {font-family: Verdana, Arial, Helvetica, sans-serif}
.Stil5 {font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; }
.Stil7 {font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; color: #990000; }
-->
</style>
</head>

<body>
<p align="center" class="Stil1">Bestellung von Zeitungsexemplaren über das Zeitungslager</p>
<h4 align="justify" class="Stil1"> <em>Auswahl der Anforderung</em></h4>
<form action="input_radio.htm">
  <pre class="Stil3"><input type="radio" name="Auswahl" value="Hausintern" />    <span class="Stil3">Bestellung für Mitarbeiter (Hausintern)            <input type="radio" name="Auswahl" value="Hausextern" />    Bestellung für Kunden (Hausextern)</span>

</pre>
  <table width="200" border="0">
    <tr>
      <td><label><span class="Stil3">Besteller</span>
        <input type="text" name="Besteller" id="Besteller" />
      </label></td>
      <td><label><span class="Stil3">Telefonnummer</span>
          <input type="text" name="Telefonnummer" id="Telefonnummer"/>
      </label></td>
    </tr>
  </table>
  <p>&nbsp;</p>
  <p>&nbsp;</p>

</form>
<form id="form1" name="form1" method="post" action="">
  <label><span class="Stil5">Bestellung für Kunden</span><br />
  <br />
  </label>
  <table width="893" border="0">
    <tr>
      <td width="144"><span class="Stil3">Vorname</span>
      <input type="text" name="Vorname" id="Vorname" /></td>
      <td width="144"><span class="Stil3">Nachname</span>
      <input type="text" name="Nachname" id="Nachname" /></td>
      <td width="144"><span class="Stil3">Straße</span>
      <input type="text" name="Strasse" id="Strasse" /></td>
      <td width="144"><span class="Stil3">Plz</span>
      <input type="text" name="Plz" id="Plz" /></td>
      <td width="144"><span class="Stil3">Ort</span>
      <input type="text" name="Ort" id="Ort" /></td>
    </tr>
  </table>
   <p><span class="Stil3">Rechnung erstellen?</span>
     <input type="checkbox" name="Rechnung" id="Rechnung" /></p>
  <label><br />
  </label>
</form>
<p>
<form id="form1" name="form1" method="post" action="">
  <label><span class="Stil5">Bestellung für Mitarbeiter</span><br />
  <br />
  </label>
  <table width="893" border="0">
    <tr>
      <td width="144"><span class="Stil3">Empfänger</span>
      <input type="text" name="Empfänger" id="Empfänger" /></td>
      <td width="144"><span class="Stil3">Hauptabteilung</span>
      <input type="text" name="Hauptabteilung" id="Hauptabteilung" /></td>
      <td width="144"><span class="Stil3">Unterabteilung</span>
      <input type="text" name="Unterabteilung" id="Unterabteilung" /></td>
      <td width="144"><span class="Stil3">Gebäude</span>
      <input type="text" name="Gebäude" id="Gebäude" /></td>
      <td width="144"><span class="Stil3">Raumnummer</span>
      <input type="text" name="Raumnummer" id="Raumnummer" /></td>
    </tr>
  </table>
  <p>&nbsp;</p>
  <label><br />
  </label>
  <label></label>
</form>

<h4 align="justify" class="Stil1"> <em>Auswahl der benötigten Exemplare</em></h4>
<form id="form2" name="form2" method="post" action="">
  <label><span class="Stil3">Titel</span>
  <select name="Titel" id="Titel">
    <option>WAZ</option>
    <option>NRZ</option>
    <option>WP</option>
    <option>WP</option>
    <option>ZGT</option>
  </select>
  </label>
  <label><span class="Stil3">Ausgabe</span>
  <select name="Ausgabe" id="Ausgabe">
    <option>01</option>
    <option>02</option>
    <option>03</option>
    <option>04</option>
    <option>05</option>
    <option>06</option>
    <option>07</option>
    <option>08</option>
    <option>09</option>
    <option>10</option>
    <option>11</option>
    <option>12</option>
  </select>
  </label>
  <label><span class="Stil3">Erscheinungstag</span>
  <input name="Tag" type="text" id="Tag" size="2" maxlength="2" />
  <input name="Monat" type="text" id="Monat" size="2" maxlength="2" />
  </label>
  <label>
  <input name="Jahr" type="text" id="Jahr" size="2" maxlength="4" />
  </label>
  <label><span class="Stil3">Anzahl</span>
  <input name="Anzahl" type="text" id="Anzahl" size="4" maxlength="4" />
  </label>
</form>
<form id="form3" name="form3" method="post" action="">
  <span class="Stil7">
  <label><a href="gesendet.html" target="_blank"><br />
  <br />
  Bestellung abschicken</a></label>
  </span><span class="Stil7">
  <label><a href="hinzufügen.html" target="_blank"><a href="hinzufügen.html" target="_blank"></a><a href="hinzufügen.html" target="_blank">Weitere Ausgabe hinzufügen</a> <br />
  <a href="hinzufügen.html" target="_blank"><br />
  </a></a></label>
  </span>
</form>

<p align="justify" class="Stil1">&nbsp;</p>
</body>

</html>

DANKE :)

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. formularfeld nach auswahl ein/ ausblenden

    suit Homepage des Autors
    – Informationen zu den Bewertungsregeln

    Hallo,
    ich möchte gerne das nach der Auswahl ( intern / extern ) die Formularfelder für die Person eingeblendet bzw. ausgeblendet werden. Kann mir jemand helfen? hier der code:

    ich drücks mal so aus: "was ist kaputt?" oder besser "hä?"
    ich seh nur mitarbeiter, kunden, empfänger und mehrere voneinander getrennte formulare

    wenn das zusammengehört, solltest du dir grundlegend mal fieldsets ansehen - anhand derer lassen sich dann bestimmte feldergruppen leicht ein und ausblenden

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. formularfeld nach auswahl ein/ ausblenden

      minicrispie Homepage des Autors
      – Informationen zu den Bewertungsregeln

      Hi,

      ich drücks mal so aus: "was ist kaputt?" oder besser "hä?"
      ich seh nur mitarbeiter, kunden, empfänger und mehrere voneinander getrennte formulare

      genau dasselbe hab ich jetzt auch grad gedacht^^
      ne problembeschreibung wäre nicht schlecht (beziehungsweise eine bessere)

      --
      Wo die Sprache aufhört, fängt die Musik an...
      ie:( fl:| br:^ va:| ls:/ fo:| rl:? n4:) ss:) de:] js:) ch:{ sh:) mo:) zu:)
      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

  2. formularfeld nach auswahl ein/ ausblenden

    EKKi
    – Informationen zu den Bewertungsregeln

    Mahlzeit seanjohn,

    ich möchte gerne das nach der Auswahl ( intern / extern ) die Formularfelder für die Person eingeblendet bzw. ausgeblendet werden. Kann mir jemand helfen? hier der code:

    ... den wir jetzt Zeile für Zeile durchsuchen und Dir dann DIE Lösung auf dem Silbertablett servieren sollen? Nein danke.

    .Stil1 {
    color: #800000;
    font-weight: bold;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    }
    .Stil3 {font-family: Verdana, Arial, Helvetica, sans-serif}
    .Stil5 {font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; }
    .Stil7 {font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; color: #990000; }

    Das sind SEHR schlechte Bezeichnungen für Klassen. Verwende sinnvolle.

    <h4 align="justify" class="Stil1"> <em>Auswahl der Anforderung</em></h4>

    Was jetzt? Eine Überschrift 4. Ordnung (wo sind eigentlich die Überschriften 1. - 3. Ordnung?) oder "wichtig, betont"? Verwende HTML-Tags sinnvoll.

    <pre class="Stil3"><input type="radio" name="Auswahl" value="Hausintern" />    <span class="Stil3">Bestellung für Mitarbeiter (Hausintern)            <input type="radio" name="Auswahl" value="Hausextern" />    Bestellung für Kunden (Hausextern)</span>

    </pre>

    Mein Vorschlag (nur aus dem Ärmel, ungetestet und durchaus verbesserungswürdig):

    <script type="text/javascript">  
  
[code lang=javascript]function changeAuswahl(rad) {  
  if (rad.checked) {  
    var frm = rad.form;  
    var tbodies = frm.getElementsByTagName('tbody');  
  
    for(var i = 0; i < tbodies.length; i++) {  
      var tbody = tbodies[i];  
      tbody.style.display = (tbody.className == rad.value) ? '' : 'none';  
    }  
  }  
}

    </script>
    <form>
    <table>
      <thead>
        <tr>
          <th>Auswahl</th>
          <td>
            <input type="radio" name="Auswahl" id="Auswahl_Hausintern" value="Hausintern" onclick="changeAuswahl(this);"><label for id="Auswahl_Hausintern">Bestellung für Mitarbeiter (Hausintern)</label>
            <input type="radio" name="Auswahl" id="Auswahl_Hausextern" value="Hausextern" onclick="changeAuswahl(this);"><label for id="Auswahl_Hausintern">Bestellung für Kunden (Hausextern)</label>
          </td>
        </tr>
      </thead>
      <tbody class="Hausintern">
        [...]
      </tbody>
      <tbody class="Hausextern">
        [...]
      </tbody>
      <tbody class="Hausintern">
        [...]
      </tbody>
      <tbody class="Hausextern">
        [...]
      </tbody>
    </table>
    </form>[/code]

    MfG,
    EKKi

    --
    sh:( fo:| ch:? rl:( br:> n4:~ ie:% mo:} va:) de:] zu:) fl:{ ss:) ls:& js:|
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. formularfeld nach auswahl ein/ ausblenden

      EKKi
      – Informationen zu den Bewertungsregeln

      Tja, so kann's gehen - der erste Fehler fällt mir natürlich sofort selbst auf:

      <input type="radio" name="Auswahl" id="Auswahl_Hausintern" value="Hausintern" onclick="changeAuswahl(this);"><label for id="Auswahl_Hausintern">Bestellung für Mitarbeiter (Hausintern)</label>
              <input type="radio" name="Auswahl" id="Auswahl_Hausextern" value="Hausextern" onclick="changeAuswahl(this);"><label for id="Auswahl_Hausintern">Bestellung für Kunden (Hausextern)</label>

      Richtiger wäre:

      <input type="radio" name="Auswahl" id="Auswahl_Hausintern" value="Hausintern" onclick="changeAuswahl(this);"><label for="Auswahl_Hausintern">Bestellung für Mitarbeiter (Hausintern)</label>  
<input type="radio" name="Auswahl" id="Auswahl_Hausextern" value="Hausextern" onclick="changeAuswahl(this);"><label for="Auswahl_Hausintern">Bestellung für Kunden (Hausextern)</label>

      MfG,
      EKKi

      --
      sh:( fo:| ch:? rl:( br:> n4:~ ie:% mo:} va:) de:] zu:) fl:{ ss:) ls:& js:|
      Beitrag melden
      –
      Informationen zu den Bewertungsregeln