Как изменить цвет текста ввода, если он пустой, отправить с помощью php и javascript?

В index.php у меня есть область ввода для emailId, код php для отображения ошибки пользователем и моя страница входа в систему. У меня есть код php для хранения идентификатора электронной почты пользователя в базе данных (mysql). И я не хочу, чтобы пользователь отправлял пустой идентификатор электронной почты для решения этой проблемы. Я написал «if (empty ($ uemail)) {», но я хочу показать, что область ввода пользователя пуста, изменив цвет границы области ввода текста на красный.

index.php

<input type = "email" id = "email" name = "email" placeholder = "Email">

<?php
session_start();
if (isset($_SESSION['error'])){
echo '<script type = "text/javascript">   
function downIt() {
document.getElementById("input").style.cssBorder = "color: red";
}
</script>';
}
unset ($_SESSION['error']); 
session_destroy ();
?>

login.php

$uemail = $_POST['email'];
if (empty($uemail)){
$_SESSION['error'];
Header( 'Location: index.php');
exit;
}
else{
query code....here....
}
session_start(); должен вызываться перед любым выходом, поэтому, возможно, сеансы не работают, как вы думаете (или работают из-за буферизации вывода, но все же вы должны это исправить), также $_SESSION['error']; должен вызывать уведомление Undefined index и фактически не настраивать сеанс, правильный: $_SESSION['error'] = true;. idk, почему вы отделяете обработчик отправки формы в другой файл, но обычно вы обрабатываете отправку формы прямо перед выводом формы html, а в случае ошибки просто выполните что-то вроде: <input ... <?= ($error?' class = "error"':'') ?>>, и вам вообще не нужны сеансы.
Kazz 27.10.2018 17:30

если я понял ваш вопрос, вы можете использовать атрибут, необходимый в теге html и. Я согласен с тем, что @Kazz поместил session_start () в качестве кода первой строки ... пример необходимого тега <input type = "email" id = "email" name = "email" placeholder = "Email" required>

Ferdinando 27.10.2018 17:54

Всем спасибо за ответ.

Jhon 27.10.2018 18:09
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
3
580
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Почему бы вам не попробовать вместо этого просто HTML5? Например:

<style>
    .was-validated input:invalid {
        border: 1px solid red;
    }
</style>

<script>
    // Bootstrap code
    // Example starter JavaScript for disabling form submissions if there are invalid fields
    (function () {
        'use strict';
        window.addEventListener( 'load', function () {
            // Fetch all the forms we want to apply custom Bootstrap validation styles to
            var forms = document.getElementsByClassName( 'needs-validation' );
            // Loop over them and prevent submission
            var validation = Array.prototype.filter.call( forms, function ( form ) {
                form.addEventListener( 'submit', function ( event ) {
                    if ( form.checkValidity() === false ) {
                        event.preventDefault();
                        event.stopPropagation();
                    }

                    form.classList.add( 'was-validated' );
                }, false );
            } );
        }, false );
    })();
</script>

<form method = "post" action = "login.php" class = "needs-validation" novalidate>
    <input type = "email" id = "email" name = "email" placeholder = "Email" required />
    <br />
    <input type = "submit" />
</form>

Но если вы все равно хотите использовать PHP, я не вижу причин использовать Javascript.

index.php

<?php
session_start();

$error_border = '';
if ( isset( $_SESSION[ 'error' ] ) ) {
    $error_border = ' style = "border: 1px solid red;"';
}

unset ( $_SESSION[ 'error' ] );
?>

    <form method = "post" action = "login.php">
        <input type = "email" id = "email" name = "email" placeholder = "Email"<?php echo $error_border; ?> />
        <br />
        <input type = "submit" />
    </form>

<?php session_destroy(); ?>

login.php

<?php
session_start(); // resume existing session

$uemail = $_POST[ 'email' ];
if ( empty( $uemail ) ) {
    $_SESSION[ 'error' ] = 1;
    Header( 'Location: index.php' );
    exit;
} else {
    query code....here....
}

Другие вопросы по теме