Форма отправки HTML, выполняющая только одну функцию JavaScript при отправке

Question

Добрый день,

В настоящее время я нахожусь в процессе создания веб-сайта с использованием HTML, PHP и JavaScript, и у меня возникла проблема при попытке проверить дубликаты имен пользователей в базе данных.В настоящее время у меня есть форма, которая использует следующий код для вызова двух функций JavaScript при отправке.

<form onsubmit="return (checkValid() && usernameCheck())" action="create.php" method="post" id="registerForm">

Затем в нижней части тега body, внутри тегов script, присутствует код javascript.

<script>

            var pass = document.getElementById('passVal').value;
            var confPass = document.getElementById('confPassVal').value;
            var error = document.getElementById('errorMsg');
            var result = true;

        function checkValid(){ 

            if(pass !== confPass)
            {
                error.type = "text";
                error.value = "Passwords do not match!";
                error.style.backgroundColor = "#E34234";
                document.getElementById('passVal').style.borderColor = "#E34234";
                document.getElementById('confPassVal').style.borderColor = "#E34234";
                result = false;
            }

            return result;

        }

            function usernameCheck()
            {

              var username = document.getElementById('userName').value;
              var j = checkName(username);
              console.log(j);

              if ( j == "taken" ) {
                error.type = "text";
                error.value = "Username Already Exists, Please choose an alternative.";
                error.style.backgroundColor = "#E34234";
                document.getElementById('userName').style.borderColor = "#E34234";
                console.log(j);
                result = false;
              }
              if ( j == "available" ) {
                console.log(j);
                result = true;
              }

                return result;
            }

        function checkName(uname) {

              if (window.XMLHttpRequest) {
                xhttp = new XMLHttpRequest();
              } else {
                xhttp = new ActiveXObject("Microsoft.XMLHTTP");
              }
              var httpURL = "checkUserName.php?n=" + uname;
              xhttp.open("GET",httpURL,false);
              xhttp.send();
              return xhttp.responseText;
            }

    </script>

Проблема, с которой я столкнулся, заключается в том, что вторая функция JavaScript не выполняется, даже если она вызывается в функции onsubmit.Из-за этого третья функция также не выполняется, так как эта функция вызывается во второй функции.Вторая функция передает значение GET с именем пользователя, введенным в форме HTML, в скрипт PHP.Затем скрипт PHP проверяет базу данных, чтобы увидеть, существует ли этот пользователь, и возвращает значение, основываясь на том, верно это или нет.Приведенный ниже код показывает скрипт PHP.

<?php
session_start();

require 'sql.php';

header('Content-type: text/plain');
$userName = $_GET['n'];

$query =  "SELECT username FROM users where username='$username'";
$checkun = $conn->query($query);
while ($row = $checkun->fetch_assoc()) {
    if ($row > 0) 
    {
        exit('taken');
    } else
    {
        exit('available');
    }
}

?>

Первая функция JavaScript успешно выполняется, которая используется для проверки соответствия полей пароля.Эта функция возвращает либо ложное значение, если поля пароля не совпадают (следовательно, вторая функция не будет выполняться), либо истинное значение, если они совпадают.Даже если первая функция возвращает true, следующая функция не выполняется, и форма отправляется без выполнения этой второй функции.

Я был бы признателен, если бы кто-то более опытный, чем я (я занимался только веб-разработкой длянесколько месяцев) может выделить какие-либо ошибки в моем методе и, возможно, помочь мне найти решение.

Спасибо, что нашли время, чтобы прочитать это!

Answer 1

Когда вы говорите «вторая функция не запускается» - вы имеете в виду, что вы не получаете ответа в JS?Я полагаю, что это будет правдой, поскольку у вас НИКОГДА не будет совпадения в вашем запросе MySQL - и у вас нет «ловушки» в нужном месте.

Это похоже на первый опыт для вас, чтобы получить данные из базы данных, поэтому я не буду упрекать тот факт, что вы широко открыты для атак с использованием SQL-инъекций, хотя я скажу, что вы НЕ должны использоватьэтот код в любой открытой системе, где есть настоящие пользователи (вам нужно научиться защищаться от этих атак - об этом много информации на SO)!

Итак, ваш первый шаг по крайней мере к получению 'вторая функция «работать» .....

<?php
session_start();
require 'sql.php';
header('Content-type: text/plain');
// $userName = $_GET['n']; // <<<==== here you use with a capital
$username = $_GET['n']; // let's change it to be the same
$query =  "SELECT username FROM users where username='$username'"; // now, we have a chance...
$checkun = $conn->query($query);
while ($row = $checkun->fetch_assoc()) {
    if ($row > 0) 
    {
        exit('taken');
    }
}
// Here is where to put your 'catchall' in case you don't get anything from the query (what you have won't ever give 'available')
exit('available');
?>