Quantcast
Channel: Forum Pasja Informatyki - Najnowsze pytania
Viewing all articles
Browse latest Browse all 65225

Prosty formularz kontaktowy z AJAX

$
0
0

Witam, potrzebuję zrobic prosty formularz wysylajacy maila bez przeladowywania strony. Udalo mi sie napisac cos takiego:

HTML:

<section>

        <form id="contact-form" name="contact-form" method="post">
            
            <h1>Napisz do nas!</h1>
        
                <label for="name" id="name">Imię:</label><br/>
                <input type="text" name="name" id="name" required/><br/>
                
                <label for="mail" id="mail">Twój e-mail:</label><br/>
                <input type="text" name="mail" id="mail" required/><br/><br/>
                
                <label for="text" id="text">Treść</label>
                <textarea id="text" name="text" required></textarea>
                
                <input type="submit" id="submit" name="submit" value="Wyślij" />
        
        </form>
        
        <div id="sukces">
            <p>E-mail został wysłany! Wkrótce się z Tobą skontaktujemy!</p>
        </div>
            
        <div id="error">
            <p>Coś poszło nie tak. Odśwież stronę lub spróbuj ponownie później.</p>
        </div>
        
</section>

JS:

$(document).ready(function(){
    $("#submit").click(function(){
        $("#contact-form").validate({
            rules: {
                name: {
                    required: true,
                    minlength: 3
                },
                mail: {
                    required: true,
                    email: true
                },
                text: {
                    required: true,
                    minlength: 10
                }
            },
            messages:
            {
                name: {
                    required: " Chyba masz imię, co nie?",
                    minlength: " Wydaje nam się, że Twoje imię jest dłuższe."
                },
                mail: {
                    required: " Potrzebujemy Twojego maila, abyśmy mogli odpisać.",
                    email: " To nie wygląda jak e-mail."
                },
                text: {
                    required: " Przecież nie wyślesz pustej wiadomości?<br/>",
                    minlength: " Rozpisz się troszkę bardziej, prosimy!<br/>"
                }
            },
            submitHandler: function(form) {
                $("contact-form").ajaxSubmit({
                    type: "POST",
                    data: $("#contact-form").serialize(),
                    url: "mail.php",
                    success: function(){
                        $("#submit").attr("disabled", "disabled");
                        $("#sukces").fadeIn();
                    },
                    error: function(){
                        $("#error").fadeIn();
                    }
                });
            }
        });// koniec validate
    });
}); //koniec

PHP:

<?php
    $to = "mojmail@o2.pl";
    $subject = "Masz wiadomość od klienta.";
    $name = $_POST['name'];
    $from = $_POST['mail'];
    $text = $_POST['text'];
    $message = "Wiadomośc od: $name\r\n
        $text
    ";
        
    $send = mail($to, $subject, $message);
?>

Wzorowalem sie na tym: https://gist.github.com/ajtroxell/6731408

Wtyczka validate dziala, tylko juz po kliknieciu "wyslij" nic sie nie dzieje. Ktos moglby pomoc, gdzies jakies literowki znalezc, ogolnie jakies bledy? Z gory dziekuje za pomoc :D


Viewing all articles
Browse latest Browse all 65225

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>