Email-Empfänger-Auswahl als Pull-Down
JavaScript versendet eine Nachricht an eine der Adressen der Auswahlliste. Beispiel mit inaktivem Sendebutton, solange zwei wichtige Bedingungen nicht erfüllt sind.
CSS Formatierung der Formulaelemente, 2 Bedingungen implementiert: 1) Fehler beim Senden ohne Empfängerauswahl abgefangen 2) Deaktivierter Sende-Button bei leerem Betreff-Feld
|
|
Diese Version eines Formulars ist dann interessant, wenn die Nachricht an eine bestimmte Abteilung ihrer Organisation gerichtet werden soll. So hat der zuständige Sachbearbeiter auch die Nachricht im Briefkasten.
2 Bedingungen 'eingebaut'
1) Ein Empfänger muss zuerst ausgewählt werden!
Ich habe das Script von Jeff Kieke so modifiziert, das zuerst (und auf jeden Fall) ein Empfänger ausgewählt werden muss. Das erreiche ich durch die Funktion 'check()' die sofort aktiviert wird [mit onFocus()], wenn der Coursor in ein Eingabefeld gesetzt wird. Ist zu diesem Zeitpunkt die Empfängerauswahl noch nicht getroffen, wird eine Meldung angezeigt und der Fokus auf die Auswahl gesetzt.
2) Betreff muss eingetragen sein
Meine 2. Änderung überwacht das Betreff-Feld. Solange es leer bleibt ist der Sende-Button dekativiert. Dazu wird der Button gleich beim Laden der Seite auf 'inaktiv' gesetzt. Der Status wird erst dann geändert, wenn a) ein Empfänger ausgewählt wurde und b) bereits ein Eintrag im Betreff-Feld steht.
Deaktivierung des Submit-Buttons
<script type="text/javascript" language="JavaScript">
<!--
document.Formular4.send.disabled=true;
//-->
</script>
Anwendung
Ob sie dieses Script nun fürs Büro oder im Sportverein einsetzen, wo sie z.B. die Auswahl auf den Vorstand, die Jugendabteilung oder den Pressewart festlegen. Sinvoll erscheint eine Selektierung ganz sicher.
Anpassungen:
Damit die Post auch ankommt müssen Sie natürlich Ihre Auswahl an Emailadressen im Pull-Down-Menü des Formulars notieren. Diese Anpassung ist zwingend notwendig!
<option value="">Empfänger auswählen
<option value="Entwicklung@xyz.de">Entwicklung
<option value="Kundendienst@xyz.de">Kundendienst
<option value="Marketing@xyz.de">Marketing
Formularelemente formatieren
CSS-Angaben im Head für die Formatierung des Formularelemente:
<style type="text/css">
<!--
input,textarea {
border: #000000;
border: 1px solid #7F7F7F;
background-color: #FAFAFA;
width:250px;
}
.auswahl {
border: #000000;
border: 1px solid #7F7F7F;
background-color: #FAFAFA;
width:250px;
}
.butt {
cursor: hand;
border: 1px solid #7F7F7F;
background-color: #F0F0F0;
width:80px;
}
-->
</style>
Klassenangaben für das Pull-Down-Menü:
<select class="auswahl" ...
Klassenangaben für die beiden Buttons:
<input class="butt" type ... >

|