[Tutorial] PHP Emailformular

Diskutiere mit über: [Tutorial] PHP Emailformular im Web Page Design Forum

  1. sevY

    sevY Thread Starter Gast

    Hi,

    da ja einige Fragen aufgetreten sind, habe ich anbei mal ein Script, welches ein PHP Emailformular darstellt.
    Die Eingaben des Formulars werden mittels Javascript überprüft. Dabei ist eine kleine „JavaScript Detection“ eingebaut, die es erlaubt, bei fehlendem JavaScript den Button zum Versenden des Formulars „auszublenden“.
    Wird die Email erfolgreich abgeschickt, bekommt der User eine Mitteilung, in dem sich eine JavaScript alert() Box öffnet und ihm dieses mitgeteilt wird. Diese Methode wird auch für die Fehlerbenachrichtigung verwendet.
    Pflichtfelder sind hier NAME und (TELEFON oder EMAIL).
    Die Email wird dazu noch auf Integrität gecheckt.

    PHP:

    <!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>
    <style type="text/css">
    .singleline
        {
        width:176px;
        height:12px;
        margin:0px 0px 5px 0px;
        padding:2px 2px 2px 2px;
        border-width:1px;
        border-color:#949fae;
        border-style:solid;
        background-color:#ffffff;
        color:#617188;
        font-family:Verdana,Helvetica,Arial,sans-serif;    
        font-size:10px;
        line-height:12px;
        font-weight:normal;
        text-decoration:none;  
        }

    .multiline 
        {
        width:362px;
        height:80px;
        margin:0px 0px 8px 0px;
        padding:2px 2px 2px 2px;
        border-width:1px;
        border-color:#949fae;
        border-style:solid;
        background-color:#ffffff;
        color:#617188;
        font-family:Verdana,Helvetica,Arial,sans-serif;    
        font-size:10px;
        line-height:12px;
        font-weight:normal;
        text-decoration:none;    
        overflow:hidden;
        }
          

    .submit 
        {
        width:100px;
        margin:5px 0px 0px 0px;
        padding:0;
        border-width:1px;
        border-color:#949fae;
        border-style:solid;
        background-color:#ffffff;
        color:#617188;
        font-family:Verdana,Helvetica,Arial,sans-serif;    
        font-size:9px;
        line-height:12px;
        font-weight:bold;
        text-decoration:none;
        }
    </style>

    <script language="javascript" type="text/javascript">
    function integrityCheck(x)
        {
        var a=false;
        var res=false;
        if(typeof(RegExp)=='function')
            {
            var b=new RegExp('abc');
            if(b.test('abc')==true)
                {
                a=true;
                }
            }
        if(a==true)
            {
            reg=new RegExp('^([a-zA-Z0-9\\-\\.\\_]+)'+
                '(\\@)([a-zA-Z0-9\\-\\.]+)'+
                '(\\.)([a-zA-Z]{2,4})$');
            res=(reg.test(x));
            }
        else
            {
            res=(x.search('@') >= 1 && x.lastIndexOf('.') > x.search('@') && x.lastIndexOf('.') >= x.length-5)
            }
        return(res);
        }

    function checkForm(name,phone,mail)
        {
        if(document.contact.name.value=='' || document.contact.name.value=='Name*') 
            {
            alert('Bitte geben Sie einen Namen ein!');
            document.contact.name.focus();
            return false;
            break;
            }
        else if((document.contact.phone.value=='' || document.contact.phone.value=='Telefon*') && integrityCheck(document.contact.mail.value)==false) 
            {
            alert('Bitte geben Sie eine Telefonnummer oder eine Emailadresse ein!');
            document.contact.phone.focus();
            return false;
            break;
            }
        else
            {
            document.contact.submit();
            return true;
            break;
            }
        }
    </script>
    <title>Form</title>
    </head>
    <?php 
    $recipient
    ='yves@das-studio.com';
    if(isset(
    $_POST['target']))
        {
        
    $boundary=strtoupper(md5(uniqid(time())));
        
    $header="From:".$_POST['name']."<".$_POST['mail'].">\n";
        
    $header.="Reply-To: ".$_POST['mail']."\n"
        
    $header.="X-Mailer: PHP/" .phpversion(). "\n";          
        
    $header.="X-Sender-IP: ".$_SERVER["REMOTE_ADDR"]."\n";
        
    $content=
        
    $_POST['message'].'
        

        Name: '
    .$_POST['name'].'
        Telefon: '
    .$_POST['phone'].'
        Browser: '
    .$_SERVER['HTTP_USER_AGENT'].'
        Gateway: '
    .getHostByAddr($_SERVER['REMOTE_ADDR']).'
        IP: '
    .$_SERVER['REMOTE_ADDR'];

        if(
    mail($recipient,$_POST['subject'].', Anfrage vom '.date('d.m.Y'),$content,$header))
            {
            
    $notify='onload="javascript:alert(\'Vielen Dank, '.$_POST['name'].'. Ihre Email wurde zugestellt.\');"';
            }
        }
    echo
    '<body'.(isset($notify) ? ' '.$notify.'>' '>');
    ?>
    <form name="contact" action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">
        <input type="hidden" name="target" value="0" />
        <input class="singleline" type="text" name="name" value="Name*" />
        <input class="singleline" type="text" name="phone" value="Telefon*" /><br />
        <input class="singleline" type="text" name="mail" value="Email*" />
        <input class="singleline" type="text" name="subject" value="Betreff" /><br />
        <textarea class="multiline" name="message">Nachricht</textarea><br />
        <script language="javascript" type="text/javascript">
            var submit='<input class="submit" type="button" value="Email" onclick="javascript:checkForm(document.contact.name.value,document.contact.phone.value,document.contact.mail.value);">';
            document.write(submit);
        </script>
        <noscript>
            <img src="img/enable_javascript.gif" alt="Enable JavaScript" />
        </noscript>
        </form>  
    </body>
    </html>
    Gruß

    Yves
     
  2. Nogger

    Nogger MacUser Mitglied

    Beiträge:
    367
    Zustimmungen:
    0
    Registriert seit:
    03.08.2004
     
  3. sevY

    sevY Thread Starter Gast

    Hi,

    erstmal Danke das du Dir die Mühe machst, mein Script zu korrigieren.

    Wie denn?



    Laut selfHTML scheint meine Schreibweise ok zu sein…
    http://de.selfhtml.org/javascriptintro.htm#standards_varianten_versionen

    Deine Version funktioniert bei mir nicht in Safari.

    Stimmt. Habe ich geändert.

    War auch so gedacht.
    Ich definiere generell der Übersicht wegen immer ein „wenig“ mehr, auch wenn es nicht unbedingt sein muss.

    Naja, da hast du prinzipiell recht.
    Nur finde ich es besser, das das Formular vor Eingabe auf „Plausibilität und Pflichtfelder“ überprüft wird.
    Wenn ich mich nicht irre, kann man sich doch bei serverseitiger Validierung das Javascript gänzlich sparen, oder wie verhindert man, das ein Formular nicht abgesendet wird, falls z.B. Inhalte fehlen.

    Gibt es eine Alternative?

    Yves
     
  4. sevY

    sevY Thread Starter Gast

    Hi,

    so kann man XHTML & CSS konform trotzdem JavaScript nutzen:

    PHP:
    <!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" />
    <
    meta http-equiv="expires" content="14" />
    <
    meta name="description" content="x" />
    <
    meta name="keywords" lang="de" content="x" />
    <
    meta name="robots" content="all" />
    <
    meta name="revisit-after" content="14 days" />
    <
    meta name="author" content="x" />
    <
    meta name="publisher" content="x" />
    <
    script language="javascript" type="text/javascript">
    function 
    validateEmail(x
    ****{ 
    ****var 
    a=false
    ****var 
    res=false
    ****if(
    typeof(RegExp)=='function'
    ********{ 
    ********var 
    b=new RegExp('abc'); 
    ********if(
    b.test('abc')==true
    ************{ 
    ************
    a=true
    ************} 
    ********} 
    ****if(
    a==true
    ********{ 
    ********
    reg=new RegExp('^([a-zA-Z0-9\\-\\.\\_]+)'
    ************
    '(\\@)([a-zA-Z0-9\\-\\.]+)'
    ************
    '(\\.)([a-zA-Z]{2,4})$'); 
    ********
    res=(reg.test(x)); 
    ********} 
    ****else 
    ********{ 
    ********
    res=(x.search('@') >= && x.lastIndexOf('.') > x.search('@') && x.lastIndexOf('.') >= x.length-5
    ********} 
    ****return(
    res); 
    ****} 

    function 
    validateForm(name,phone,mail
    ****{ 
    ****if(
    document.contact.name.value=='' || document.contact.name.value=='Name*'
    ********{ 
    ********
    alert('Bitte geben Sie einen Namen ein!'); 
    ********
    document.contact.name.focus(); 
    ********return 
    false
    ********} 
    ****else if((
    document.contact.phone.value=='' || document.contact.phone.value=='Telefon*'**) && validateEmail(document.contact.mail.value)==false)
    ********{ 
    ********
    alert('Bitte geben Sie eine Telefonnummer oder eine Emailadresse ein!'); 
    ********
    document.contact.phone.focus(); 
    ********return 
    false
    ********} 
    ****else 
    ********{ 
    ********
    document.contact.submit(); 
    ********return 
    true;  
    ********} 
    ****} 
    </script>
    <style type="text/css">
    body,form 
        {
        margin:0;
        padding:0;   
        border:0;
        color:#617188;
        font-family:Verdana,Helvetica,Arial,sans-serif;    
        font-size:10px;
        line-height:12px;
        font-weight:normal;
        text-decoration:none;
        }
    .singleline
        {
        width:176px;
        height:12px;
        margin:0px 0px 5px 0px;
        padding:2px 2px 2px 2px;
        border-width:1px;
        border-color:#949fae;
        border-style:solid;
        background-color:#ffffff;
        color:#617188;
        font-family:Verdana,Helvetica,Arial,sans-serif;    
        font-size:10px;
        line-height:12px;
        font-weight:normal;
        text-decoration:none;  
        }

    .multiline 
        {
        width:362px;
        height:80px;
        margin:0px 0px 8px 0px;
        padding:2px 2px 2px 2px;
        border-width:1px;
        border-color:#949fae;
        border-style:solid;
        background-color:#ffffff;
        color:#617188;
        font-family:Verdana,Helvetica,Arial,sans-serif;    
        font-size:10px;
        line-height:12px;
        font-weight:normal;
        text-decoration:none;    
        overflow:hidden;
        }
        
    .submit 
        {
        width:100px;
        margin:5px 0px 0px 0px;
        padding:0;
        border-width:1px;
        border-color:#949fae;
        border-style:solid;
        background-color:#ffffff;
        color:#617188;
        font-family:Verdana,Helvetica,Arial,sans-serif;    
        font-size:9px;
        line-height:12px;
        font-weight:bold;
        text-decoration:none;
        }
    </style>
    <title>x</title>
    </head>
    <body>
    <form name="contact" action="test.html" method="post">
        <input type="hidden" name="target" value="0" />
        <input class="singleline" type="text" name="name" value="Name*" tabindex="1" />
        <input class="singleline" type="text" name="phone" value="Telefon*" tabindex="2" /><br />
        <input class="singleline" type="text" name="mail" value="Email*" tabindex="3" />
        <input class="singleline" type="text" name="subject" value="Betreff" tabindex="4" /><br />
        <textarea class="multiline" name="message" tabindex="5" rows="" cols="">Nachricht</textarea><br /> 
        
    ****<script language="javascript" type="text/javascript"> 
            if(document.createElementNS)
                { 
                var button=document.createElementNS("http://www.w3.org/1999/xhtml","input"); 
                button.setAttribute("class", "submit");
                button.setAttribute("type", "button"); 
                button.setAttribute("value", "Email"); 
                button.setAttribute("onclick", "javascript:validateForm(document.contact.name.value,document.contact.phone.value,document.contact.mail.value);"); 
                document.getElementsByTagName("form")[0].appendChild(button); 
                } 
        </script> 
        <noscript> 
    ********Javascript required. Please enable. 
    ****</noscript> 
    </form>** 
    <p>
        <a href="http://validator.w3.org/check?uri=referer">
            <img src="http://www.w3.org/Icons/valid-xhtml10" alt="Valid XHTML 1.0!" height="31" width="88" />
        </a>
    </p>
    <p>
        <a class="right" href="http://jigsaw.w3.org/css-validator/"><img src="http://jigsaw.w3.org/css-validator/images/vcss" alt="Valid CSS!" height="31" width="88" /></a>
    </p>
    </body> 
    </html>
    Das wäre der HTML Teil.

    Interessant wäre, wenn du am o.g. Beispiel mal verdeutlichen kannst, wie die korrekte Schreibweise der Pfadangabe im DOM sein soll, damit die IE Abkürzung Ihre Koffer packen kann.

    Der Übersicht halber sollte das ganze ausgelagert werden.

    PHP:
    <!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" />
    <
    meta http-equiv="expires" content="14" />
    <
    meta name="description" content="x" />
    <
    meta name="keywords" lang="de" content="x" />
    <
    meta name="robots" content="all" />
    <
    meta name="revisit-after" content="14 days" />
    <
    meta name="author" content="x" />
    <
    meta name="publisher" content="x" />
    <
    link rel="stylesheet" type="text/css" href="default.inc.css" />
    <
    link rel="shortcut icon" type="image/ico" href="img/favicon.ico" />
    <
    script language="javascript" type="text/javascript" src="function.inc.js"></script>
    <title>x</title>
    </head>
    <body>
    <form name="contact" action="test.html" method="post">
        <input type="hidden" name="target" value="0" />
        <input class="singleline" type="text" name="name" value="Name*" tabindex="1" />
        <input class="singleline" type="text" name="phone" value="Telefon*" tabindex="2" /><br />
        <input class="singleline" type="text" name="mail" value="Email*" tabindex="3" />
        <input class="singleline" type="text" name="subject" value="Betreff" tabindex="4" /><br />
        <textarea class="multiline" name="message" tabindex="5" rows="" cols="">Nachricht</textarea><br /> 
        
    ****<script language="javascript" type="text/javascript"> 
            if(document.createElementNS)
                { 
                var button=document.createElementNS("http://www.w3.org/1999/xhtml","input"); 
                button.setAttribute("class", "submit");
                button.setAttribute("type", "button"); 
                button.setAttribute("value", "Email"); 
                button.setAttribute("onclick", "javascript:validateForm(document.contact.name.value,document.contact.phone.value,document.contact.mail.value);"); 
                document.getElementsByTagName("form")[0].appendChild(button); 
                } 
        </script> 
        <noscript> 
    ********Javascript required. Please enable. 
    ****</noscript> 
    </form>** 
    <p>
        <a href="http://validator.w3.org/check?uri=referer">
            <img src="http://www.w3.org/Icons/valid-xhtml10" alt="Valid XHTML 1.0!" height="31" width="88" />
        </a>
    </p>
    <p>
        <a class="right" href="http://jigsaw.w3.org/css-validator/"><img src="http://jigsaw.w3.org/css-validator/images/vcss" alt="Valid CSS!" height="31" width="88" /></a>
    </p>
    </body> 
    </html>
    Als letztes stünde dann die Überarbeitung der Formvalue-Validation mit einem Mix aus server- und clientseitig an.
    Hier benötige ich ebenfalls Deinen Tipp.


    Gruß Yves
     
  5. Nogger

    Nogger MacUser Mitglied

    Beiträge:
    367
    Zustimmungen:
    0
    Registriert seit:
    03.08.2004
    Tach,

    Jein. Die Einbindung ist noch nicht korrekt. Siehe http://www.w3.org/TR/xhtml1/#h-4.8

    Ich habe nochmals nachgeschlagen.

    document.forms["formname"].elements["elementname"] ist der W3C Weg.

    document.formname.elementname wird von vielen/manchen/allen Browsern unterstützt, besser ist es trotzdem die andere Möglichkeit zu nehmen.

    http://www.jibbering.com/faq/faq_notes/form_access.html

    Sicher, daß du dich nicht vertippt hast, und es deshalb bei dir nicht funktioniert hat?

    PHP:
    <html>
    <
    body>

    <
    form name="test">
    <
    input name="feld" value="testinhalt">
    </
    form>

    <
    script>
    alert(document.forms["test"].elements["feld"].value);
    </script>

    </body>
    </html>
    Was aber auch letztlich egal ist, denn bei xhtml ist beides nicht erlaubt, wie ich lernen durfte. http://www.xml.com/pub/a/2003/03/19/dive-into-xml.html (der Artikel hat mich mal wieder darin bestärkt bei HTML 4.01 zu bleiben).

    Dem Form-Element eine ID geben und per getElementById() zugreifen ist da angesagt.

    PHP:
                button.setAttribute("onclick""javascript:validateForm(document.contact.name.value,document.contact.phone.value,document.contact.mail.value);"); 
    Wie gesagt, da kann statt "javascript:" auch "HohohoDerWeihnachtsmannIstDa:" stehen :)

    PHP:
                document.getElementsByTagName("form")[0]
    Das würde ich nicht nehmen, weil es fragil ist in Bezug auf den Dokumentenaufbau. Irgendwann baut jemand dann oben noch ein Suchfeld ein und schon funktioniert es nicht mehr, weil es nicht mehr das erste Formular ist.

    Erstell die Formularverarbeitung erstmal nur auf Basis von PHP. Mit den gewünschten Prüfungen und Fehlerausgabe. Nur serverseitig kann man sicherstellen, daß die Prüfungen auch wirklich durchlaufen werden. Es ist trivial einfach ein Formular unter Umgehung von clientseitigen Javascriptprüfungen abzuschicken. Wer sich auf diese verläßt hat verloren.

    Als zweiten Schritt kannst du dann Prüfungen mit Javascript einbauen. Diese dienen rein der Bequemlichkeit der Benutzer, weil das Formular auf Fehleingaben schneller reagiert als bei Rundreise der Formulardaten zum Server und wieder zurück.

    Gleichzeitig funktioniert das Formular nun sowohl mit, als auch ohne Javascript.
     
  6. Sublime

    Sublime MacUser Mitglied

    Beiträge:
    55
    Zustimmungen:
    0
    Registriert seit:
    18.02.2005
    Hi Yves und alle anderen Foren-Benutzer,

    ich lese in diesem Forum schon einige Zeit sehr interessiert mit und habe mich nun entschlossen das ich auch etwas "geben" möchte :).

    @ Yves: Tip zum Email-Formular:
    Es ist sowohl eine client- wie auch serverseitige Prüfung zu empfehlen. Am Server ist eh klar wie mans macht, einfach mit PHP prüfen...
    Am Client würde ich dir empfehlen eine Javascript-Funktion checkAndSendForm() zu erstellen, welche du beim Versenden aufrufst. Diese Funktion soll dann die Werte prüfen und wenn alles passt das Formular absenden, ansonst mit alert() eine Fehlermeldung ausgeben zB.

    Vorteil der client-seitigen Prüfung ist das falls das Formular aufgrund fehlender Eingaben dann nicht abgesendet wird, weder du die Inputfelder mit PHP befüllen musst, noch der User wieder alles von vorne eingeben muss. Würdest du es das Formular submitten und es wäre nicht alles eingegeben müsstest du ja damit es gut benutzt werden kann die User-Eingaben wieder in die Inputboxen schreiben.

    Um überhaupt alles abzufangen kannst du die Wiederherstellung der Userdaten, falls die PHP-Prüfung fehl schlägt, ja zusätzlich einbauen.

    Den Absenden - Button auszublenden würde ich nicht empfehlen, es sieht dann einfach wie ein unvollständiges Formular aus. Evtl. schreibt dir dann jemand nicht weil er denkt das Formular kann man sowieso nicht absenden.


    Hoffe nicht am Thema vorbei geredet und evtl. jemand damit geholfen zu haben!

    Liebe Grüße,
    Oliver
     
  7. wegus

    wegus MacUser Mitglied

    Beiträge:
    15.034
    Zustimmungen:
    1.314
    Registriert seit:
    13.09.2004
    EvoX:
    Hallo Oliver, herzlich willkommen zur aktiven Teilnahme bei MU! Freut mich!
    Ich handhabe das generell nur so, wie von Dir oben beschrieben. Javascript mache ich gar nicht, weil man immer einen Browser findet, der wieder einen "eigenen Standard" verfolgt. Ich fühle mich dabei auch immer zusehr ausgebremst. Dann ist da die leidige Frage Javascript an oder aus. Kurz: ich ignoriere Javascript so lange wie möglich. Ein einfaches PHP-Formular, mit Vorgabevariablen aus $_POST und einer vorgeschalteten Typ/Content-Prüfung tut es völlig. Als optisches goodie färbe ich Pflichtfelder dezent ein und fehlerhafte Eingaben werden ebenfalls per CSS rötlich hinterlegt. Das Prinzip habe ich mir einmal ausgetüftelt und seit dem Javascript an den Haken gehängt. Meiner persönlichen Meinung nach ist Javascript eine unzuverlässige Krücke, die ich nur nehme wenn es nicht anders geht.
     
  8. Sublime

    Sublime MacUser Mitglied

    Beiträge:
    55
    Zustimmungen:
    0
    Registriert seit:
    18.02.2005
    Hi wegus,

    gebe dir recht das ein formular wie von dir beschrieben völlig ausreicht und dabei völlig auf JS verzichtet werden kann.

    Pflichtfelder einzufärben und fehlerhafte Eingaben mit CSS rötlich zu hinterlegen finde ich eine sehr gute Variante, sieht auch viel schöner aus als ein JS-Alert().

    Ob JS nun eine Krücke ist oder nicht, trau ich micht nicht zu beurteilen. Würde es aber generell nicht so bezeichnen da es schon für einige wichtige Dinge zu gebrauchen ist. zB. bei Auswahl eines Dropdowns eine Aktion ausführen etc...

    Aber grundsätzlich ist es nicht schlecht so lange wie möglich darauf zu verzichten, solange der Aufwand dadurch nicht erheblich steigt.
     
  9. wegus

    wegus MacUser Mitglied

    Beiträge:
    15.034
    Zustimmungen:
    1.314
    Registriert seit:
    13.09.2004
    @EvoX: Das war auch nur meine persönliche Meinung! Ich handhabe es so. Natürlich kann man auch anders zum Ziel kommen! Du weißt ja, zwei Programmierer drei Lösungsansätze ;)
     
  10. sevY

    sevY Thread Starter Gast

    Hi,

    bis auf die Formeingabe Validation zu Überarbeiten habe ich es nun geschafft, das ganze erfolgreich durch den W3C Validator zu schicken.
    Korrekte Pfadangaben habe ich auch verwendet, sowie im Javascript ein wenig die Pfadangaben als Funktionsparameter übergeben und dann gegebenenfalls mit .value konkateniert.

    Code:
    [php]
    <!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" />
    <meta http-equiv="expires" content="14" />
    <meta name="description" content="W3C konformer XHTML PHP-Mailer" />
    <meta name="keywords" lang="de" content="W3C,konform,XHTML,CSS,PHP,Mail" />
    <meta name="robots" content="all" />
    <meta name="revisit-after" content="14 days" />
    <meta name="author" content="Open Source" />
    <meta name="publisher" content="Open Source" />
    <link rel="stylesheet" type="text/css" href="default.inc.css" />
    <link rel="shortcut icon" type="image/ico" href="img/favicon.ico" />
    <script language="javascript" type="text/javascript" src="function.inc.js"></script>
    <title>W3C konformer XHTML PHP-Mailer</title>
    </head><body>
    <form id="mailform" name="contact" action="/~Yves/W3C Mailform/mail.php" method="post">
        <input type="hidden" name="target" value="0" />
        <input class="singleline" type="text" name="name" value="Name*" tabindex="1" />
        <input class="singleline" type="text" name="phone" value="Telefon*" tabindex="2" /><br />
        <input class="singleline" type="text" name="mail" value="Email*" tabindex="3" />
        <input class="singleline" type="text" name="subject" value="Betreff" tabindex="4" /><br />
        <textarea class="multiline" name="message" tabindex="5" rows="" cols="">Nachricht</textarea><br />
        <script language="javascript" type="text/javascript">
            if(document.createElementNS)
                {
                var button=document.createElementNS("http://www.w3.org/1999/xhtml", "input");
                button.setAttribute("class", "submit");
                button.setAttribute("type", "button");
                button.setAttribute("value", "Email");
                button.setAttribute("onclick", "javascript:validateForm(document.forms['contact'].elements['name'],document.forms['contact'].elements['phone'],document.forms['contact'].elements['mail'],document.forms['contact']);");
                document.getElementById("mailform").appendChild(button);
                }
        </script>
        <noscript>
            <img src="img/enable_javascript.gif" alt="Enable JavaScript" />
        </noscript>
    </form>
    <p>
        <a href="http://validator.w3.org/check?uri=referer">
            <img src="http://www.w3.org/Icons/valid-xhtml10" alt="Valid XHTML 1.0!" height="31" width="88" />
        </a>
    </p>
    <p>
        <a class="right" href="http://jigsaw.w3.org/css-validator/">
            <img src="http://jigsaw.w3.org/css-validator/images/vcss" alt="Valid CSS!" height="31" width="88" />
        </a>
    </p>
    </body>
    </html>
    [/php]
    Anbei mal eine Zip mit allen Dateien, vielleicht möchte ja jemand mitbasteln.


    Also: client/server Formvalidation steht noch aus. Der Rest funktioniert W3C konform.

    Yves
     
Die Seite wird geladen...
Ähnliche Themen - [Tutorial] PHP Emailformular Forum Datum
Php täglicher Bilderwechsel Web Page Design 12.11.2012
WordPress: Jeder Redakteur soll nur eine bestimmte Seite bearbeiten dürfen! Web Page Design 12.08.2012
xml Ausgabe per PHP Web Page Design 17.05.2012
Forums erstellung ohne PHP? Web Page Design 08.10.2010
Anfängerfrage.... zu html und php Web Page Design 12.06.2009

Diese Seite empfehlen

Benutzerdefinierte Suche