Разместить форму в jQuery

0

Я пытаюсь опубликовать свою форму через jQuery. Это первый раз для меня. :)

Мой HTML и JS хорошо выглядит, мой код JS отправляет мне сообщение об ошибке.

Не могли бы вы мне помочь?

-

Мой HTML-код:

      <form id="createAccount" action="login.php" method="post" class="default-form">
        <p class="alert-message warning"><i class="ico fa fa-exclamation-circle"></i> All fields are required! <i class="fa fa-times close"></i></p>
          <input class="required" type="text" id="Username" placeholder="Username">
          <input class="required email" type="text" id="Email" placeholder="Email">
          <input class="required" type="password" id="Password" placeholder="Password">
          <input class="required" type="password" placeholder="Repeat Password">
          <button type="submit" class="submit-btn button"><i class="fa fa-plus-circle"></i> Register</button>
      </form>

Мой JS:

    <script>
$(document).ready(function() {
    $('#createAccount').on('submit', function() {

        var Username = $('#Username').val();
        var Email = $('#Email').val();
        var Password = $('#Password').val();

        if(Username == '' || Email == '' || Password == '') {
                alert('Fields are empty.');
        } else {
            $.ajax({
                url: $(this).attr('action'),
                type: $(this).attr('method'),
                data: $(this).serialize(),
                dataType: 'json',
                success: function(json) {
                        if(json.reponse == 'ok') {
                                alert('All is good');
                        } else {
                                alert('Error : '+ json.reponse);
                        }
                }
            });
        }
        return false;
    });
});
</script>

Мой PHP (login.php):

<?php
if(isset($_POST['Username']) && isset($_POST['Email']) && isset($_POST['Password'])) {
    if(($_POST['Username'] != '') && ($_POST['Email'] != '') && ($_POST['Password'] != '')) {
        $reponse = 'ok';
    } else {
        $reponse = 'Fields are empty.';
    }
} else {
    $reponse = 'Error';
}

$array['reponse'] = $reponse;
echo json_encode($array);
?>

Когда я пробую форму, отправив ее, мое предупреждение перекликается с "Ошибка".

Теги:
forms

1 ответ

0
Лучший ответ

JQuery serialize метод, при вызове на form элемента, будет использовать name атрибуты полей, а не id с. Вы можете включать атрибуты id, если хотите, но вам также нужны имена:

<form id="createAccount" action="login.php" method="post" class="default-form">
  <p class="alert-message warning"><i class="ico fa fa-exclamation-circle"></i> All fields are required! <i class="fa fa-times close"></i></p>
  <input class="required" type="text" id="Username" name="Username" placeholder="Username">
  <input class="required email" type="text" id="Email" name="Email" placeholder="Email">
  <input class="required" type="password" id="Password" name="Password" placeholder="Password">
  <input class="required" type="password" name="Repeat-Password" placeholder="Repeat Password">
  <button type="submit" class="submit-btn button"><i class="fa fa-plus-circle"></i> Register</button>
</form>

Ещё вопросы

Сообщество Overcoder
Наверх
Меню