0

Есть два PHP файла - registration.php (выводит форму для регистрации) и registration_new.php (обрабатывает данные полученные от файла registration.php методом POST и записывает их в базу данных). Вопрос - Как можно осуществить передачу данных, введенных в форму на странице registration.php, странице registration_new.php с помощью AJAX (jQuery)?

registraton.php

<?php
    header("Cache-Control: no-store, no-cache, must-revalidate, max-age=0");
    header('Content-type: text/html');

    error_reporting(E_ALL);

    $title = "Регистрация";

    require_once('header.php');

    //инициализирум механизм сесссий
    session_start(); 
    #echo (session_id()); #отладка
    #echo("<br>");
?>  
    <script type="text/javascript">
        $(function (){
            $("#create_account").submit(function(e){
                var email = $("#email").val();
                alert(!!email.match(/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,4})+$/));
                //e.preventDefault();
            });
        });
    </script>
    <section id="middle" class="group">
        <div id="container">
            <div id="content">
                <div class="container-fluid">
                    <form id="create_account" action="registration_new.php" method="POST">
                        <fieldset id="singup">
                            <legend>Создайте новый аккаунт</legend>
                            <ul>
                                <li>
                                    <label for="username"><i class="icon-user"></i>Логин:</label>
                                    <input id="username" type="text" autofocus name="username" placeholder="John" tabindex="1">
                                </li>
                                <li>
                                    <label for="email"><i class="icon-envelope"></i>Email:</label>
                                    <input id="email" type="text" name="email" placeholder="user@example.com" autocomplete="off" tabindex="2">
                                </li>
                                <li>
                                    <label for="password"><i class="icon-question-sign"></i>Пароль:</label>
                                    <input id="password" type="password" name="password" value="" autocomplete="off" placeholder="8-10 символов" tabindex="3">
                                </li>
                                <li>
                                    <label for="password_confirm"><i class="icon-question-sign"></i>Повторите пароль:</label>
                                    <input id="password_confirm" type="password" name="password_confirm" value="" autocomplete="off" placeholder="Введите пароль еще раз" tabindex="4">
                                </li>
                                <li>
                                    <button class="btn btn-primary" tabindex="5"><span><i class="icon-ok icon-white"></i></span>Зарегистрироваться</button>
                                </li>
                            </ul>
                        </fieldset>
                    </form>
                </div>
            </div><!-- #content-->
        </div><!-- #container-->
        <aside id="sideRight">
            <p>Зарегистрируйтесь, чтобы стать полноценным участником сервиса. Вы сможете голосовать, участвовать в рейтинге и использовать личные сообщения для общения с другими пользователями.</p>
        </aside><!-- #sideRight -->
    </section><!-- #middle-->
<?php
    require_once('footer.php');
?>

registarion_new.php

<?php
    header("Cache-Control: no-store, no-cache, must-revalidate, max-age=0");
    header('Content-type: text/html');

    $title = "Регистрация прошла успешно!";

    require_once("header.php");

    //Подключение к БД
    require_once("mysql.php");

    #echo (session_id()); #отладка
    #echo("<br>");

    error_reporting(E_ALL);

    //Создать короткие имена переменных
    $username = trim(strip_tags(htmlspecialchars($_POST['username']))); #login
    $email = trim(strip_tags(htmlspecialchars($_POST['email']))); 
    $password = trim(strip_tags(htmlspecialchars($_POST['password'])));
    $password_confirm = trim(strip_tags(htmlspecialchars($_POST['password_confirm'])));
    $date = date("d-m-Y H:i:s"); //Дата регистрации пользователя, чтобы можно было посчитать сколько дней и часов участник на сайте. Например - На сайте: 22 дня 13 часов.

    echo $date;

    //Проверка e-mail с помощью php (на стороне сервера)
    function validateEmail($email)
    {
        $pattern = "/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,4})+$/";
        if(!preg_match($pattern, $email)) 
        {
            return die("<br>Введите корректный email адрес.<br>");
        }
    }

    echo validateEmail($email);

    if($password === $password_confirm)
    {
        $query = "INSERT INTO users (id, username, email, password, `date`)
                VALUES(0, '$username', '$email', SHA1('$password'), NOW())";
        $result = mysql_unbuffered_query($query) or die(mysql_error());

        mysql_free_result($result);
        mysql_close($conn);

        echo("<div class=\"alert alert-success\">");
        echo("<h1>Регистрация прошла успешно!</h1><hr>\n");
        echo("<h2>Письмо с регистрационными данными было отправлено\n Вам на email - $email</h2>\n");
        echo("<p>Проверьте свою электронную почту, чтобы завершить регистрацию.</p>\n");
        echo("<p>Если письмо не придет на Ваш почтовый ящик в течении 15 минут после регистрации, проверьте, пожалуйста, папку \"Спам\".</p>\n");
        echo("<p>Если письмо от нашего сервиса попало в папку \"Спам\", отметьте его как не спам и, пожалуйста, добавьте на электронный адрес <span>add@askdev.ru</span> в Вашу адресную книгу.\n");
        echo("</div>");
    }
    else
    {
        echo("<div class=\"alert alert-error\">");
        echo("<p>Введите пароль еще раз!</p>\n");
        echo("</div>");
    }

    require_once("footer.php");
?>

2 ответа 2

3

Почитать про ajax() облом? )) Напишу очень кратко и схематически, а дальше уже сами.

HTML

<form id="reg_form">
    <input type="text" id="log" name="login" value="" />
    <input type="password" id="pass" name="pass" value="" />
    <input type="button" id="go" value="Регимся" />
<form>

jQuery

$('#go').click(function(){
    // или сериализируем данные формы
    // var regData = $('#reg_form').serialize();

    // или обрабатываем поля по отдельности
    var userLog = $.trim($('#log').val());
    var userPas = $.trim($('#pass').val());

    $.ajax({
        type: 'POST',
        url: 'handler.php',
        data: {user_login : userLog, user_pass: userPas},
        error: function(req, text, error) {
            alert('Ошибка AJAX: ' + text + ' | ' + error);
        },
        success: function (data) {
            // в data[0] - содержит значение $success
            // в data[1] - содержит значение $login (или имя юзверя)
            if(data[0]){
                alert(data[1] + ', вы зарегистрированы!');
            } else {
                alert('Хьюстон, у нас проблемы!');
            }
        },
        dataType: 'json'
    });
});

handler.php (обработчик)

if(isset($_POST['user_login'], $_POST['user_pass'])){
    $success = false;
    $login = $_POST['user_login'];
    $pass = $_POST['user_pass'];
    // дальше все ваши проверки, валидации и прочее
    // если всё гуд, то $success = true;
    // и возвращаем результат обработки:
    echo json_encode(array($success, $login));
    exit();    
}
1

Можете отправлять ajax форму с помощью jQuery плагина jQuery Form Plugin. Будет даже проще чем jQuery().ajax Отправить данные могут две функции:

jQuery('#myForm1').ajaxForm(options)

или

jQuery('#myForm1').ajaxSubmit(options);

Здесь примеры

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.