Ergebnis 1 bis 1 von 1
  1. #1
    diamo ist offline Foren As
    registriert
    15-10-2001
    Ort
    Aachen
    Beiträge
    76

    Formulardaten mittels Ajax übermitteln

    Hallo zusammen!

    Ich bin gerade dabei mir ein Kontaktformular zu basteln. Das übermitteln an sich funktioniert schon. Nur sollte es so sein, dass die Variablen nicht an den Browser übermittelt werden, sondern das ganz soll im Hintergrund ablaufen, sodass die Seite nicht neu geladen wird.

    Hab in google ein bisschen gesurft und wurde auch fündig. Da gab es ein ähnliches Script, welches ich nur noch angepasst hab.

    Im Header steht bei mir folgendes:
    PHP-Code:
        <script src="js/prototype.js" type="text/javascript"></script>
        
        <script type="text/javascript">
            function init () {
                $('submit').onclick = function () {
                    sendData();
                }
            }
            function sendData () {
                var url = 'php/mail.php';
                var pars = Form.serialize('frm');
                var myAjax = new Ajax.Request( url, {method: 'get', parameters: pars, onLoading: showLoad, onComplete: showResponse} );
            }
            function showLoad () {
                $('load').style.display = 'block';
            }
            function showResponse (originalRequest) {
                var newData = originalRequest.responseText;
                $('load').style.display = 'none';
                $('status').innerHTML = newData;
            }
        </script> 
    Der Code des Formulars ist:
    PHP-Code:
    <form id="frm" name="frm">

        <
    table cellspacing="0" cellpadding="0" border="0">
            <
    tbody>
                <
    tr>
                    <
    td valign="top" height="40">
                    <
    p><strong>Ihre Nachricht an mich:</strong><strong><br />
                    </
    strong></p>
                    </
    td>
                    <
    td valign="top">&nbsp;</td>

                </
    tr>
                <
    tr>
                    <
    td valign="top">NameVorname <span style="color: red;">*</span></td>
                    <
    td valign="top"><input type="text" size="40" id="name" class="formStyle" name="name" /></td>
                </
    tr>
                <
    tr>
                    <
    td valign="top">Firma</td>

                    <
    td valign="top"><input type="text" size="40" id="firma" class="formStyle" name="firma" /></td>
                </
    tr>
                <
    tr>
                    <
    td valign="top">Telefon</td>
                    <
    td valign="top"><input type="text" size="40" id="phone" class="formStyle" name="tele" /></td>
                </
    tr>
                <
    tr>
                    <
    td valign="top">E-Mail-Adresse <span style="color: red;">*</span></td>

                    <
    td valign="top"><input type="text" size="40" id="email" class="formStyle" name="email" /></td>
                </
    tr>
                <
    tr>
                    <
    td valign="top">Webseite</td>
                    <
    td valign="top"><input type="text" size="40" id="webseite" class="formStyle" name="webseite" /></td>
                </
    tr>
                <
    tr>
                    <
    td>&nbsp;</td>

                    <
    td>&nbsp;</td>
                </
    tr>
                <
    tr>
                    <
    td colspan="2">Beschreibung <span style="color: red;">*</span></td>
                </
    tr>
                <
    tr>
                    <
    td colspan="2"><textarea id="job" class="formStyle_Large" rows="5" cols="60" name="job"></textarea></td>

                </
    tr>
                <
    tr>
                    <
    td>&nbsp;</td>
                    <
    td>&nbsp;</td>
                </
    tr>
            </
    tbody>
        </
    table>
        <
    p align="left">           <input type="submit" value="Anfrage schicken" class="inputButton" id="submit" /> </p>

        <
    p>&nbsp;</p>
        <
    div style="display: none;" id="load">Bitte warten...</div>
        <
    div id="status">&nbsp;</div>
        <
    p>&nbsp;</p>
        <
    p><span style="font-size: 8pt;">Notwendige Angaben sind mit <span style="color: red;">*</spangekennzeichnet.</span></p>
    </
    form
    Außerdem habe ich im body noch angegeben:
    PHP-Code:
    <body onload="init()"
    Das Einblenden des Divs "display" funktioniert wunderbar.
    Anschließend sollte er im div "status" einen bestimmten Text(Error o. Success) einbinden. Tut er aber nicht, was ich nicht verstehe.

    Es werden die Variablen des Formulars übergeben und die Email abgeschickt. Die Variablen sind dann auch in der Adressleiste zu sehen(sollte doch nicht so sein?).

    Vielleicht könnte es daran liegen, dass der code in einer php liegt. Zuvor hatte ich zum Test den Code in einer externen HTML getestet und es hatte auch alles prima funktioniert.
    Geändert von diamo (16-10-2006 um 16:54 Uhr)

Ähnliche Themen

  1. Ja nach laden mittels AJAX ausführen?
    Von EnemyArea im Forum Script-Check
    Antworten: 8
    Letzter Beitrag: 16-10-2006, 13:49
  2. Ajax | Zeitverzögerung
    Von slosd im Forum JavaScript
    Antworten: 0
    Letzter Beitrag: 14-08-2006, 21:31
  3. gutes AJAX Buch
    Von Kurt Cobain im Forum JavaScript
    Antworten: 1
    Letzter Beitrag: 12-08-2006, 12:44
  4. Ajax und Java-Script
    Von Koksnuss im Forum JavaScript
    Antworten: 5
    Letzter Beitrag: 20-04-2006, 18:02
  5. Formularversand mittels ASP
    Von bluelion im Forum Serverseitige Programmierung
    Antworten: 3
    Letzter Beitrag: 17-03-2003, 18:25

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •