Нежелательные поля повторно отображаются во время обработки ошибок

Question

Я сделал это так, что у меня есть 1 форма, которая включает в себя скрытый div с дополнительными полями ввода, которые отображаются при нажатии кнопки «Добавить еще».Когда форма отправляется с недопустимыми данными, повторно отображается форма цитаты, содержащая действительные данные, а также сообщения об ошибках для недействительных данных.

Проблема заключается в том, что исходные 3 поля отображаются, когдавы впервые попадаете на страницу, которая снова отображается над формой цитирования при обработке ошибок.

Есть ли способ скрыть эти 3 поля, когда форма цитаты повторно отображается с ошибками?

// Error checking. If there are errors, call the redisplayForm function to redisplay the Quote Form Handler.
if ($errorCount>0 || $errorCount<0) {
    redisplayForm($bizName, $bizType, $address1, $address2, $city, 
    $state, $zip, $sqft, $cName, $email, $bizNameErr, $bizTypeErr,
    $address1Err, $cityErr, $stateErr, $zipErr, $sqftErr, $cNameErr, $emailErr );

    $bizNameErr = $bizTypeErr = $address1Err = $address2Err = $cityErr = $stateErr
    = $zipErr = $sqftErr = $cNameErr = $emailErr = "";

    $bizName = $bizType = $address1 = $address2 = $city = $state
    = $zip = $sqft = $cName = $email = "";
// If there are no errors, an email will be sent to Conversion Worx with the user's input.
} else {
    $To = "myemail"; 
    $Subject = "Quote Form Results";
    $Message = "Business Name: " . $bizName . "\n" 
    . "Business Type: " . $bizType . "\n"
    . "Address Line 1: " . $address1 . "\n"
    . "Address Line 2: " . $address2 . "\n"
    . "City: " . $city . "\n"
    . "State: " . $state . "\n"
    . "Zip Code: " . $zip . "\n"
    . "Estimated Square Feet: " . $sqft . "\n"
    . "Contact Name: " . $cName . "\n"
    . "Email Address: " . $email;
    $result = mail($To, $Subject, $Message);
}
// If email to Conversion Worx is sent succesfully, send thank you email to user.
if (isset($result)) {
    $To = $email;
    $Subject = "Virtual Tour Quote Request";
    $Headers = 'From: myemail' . "\r\n" . 
        'Reply-To: myemail' . "\r\n" .
        'X-Mailer: PHP/' . phpversion();
    $Message = $cName . ",";
    $Message .= "\n" . "\n" . "Thank you for your interest in our 3D 360° Virtual Tours!";
    $Message .= "\n" . "\n" . "Your information has been submitted. ";
    $Message .= "A Conversion Worx represenative will be contacting you shortly to arrange a quote via phone or on-site visit.";
    $Message .= "\n" . "\n" . "We look forward to working with you! ";
    $Message .= "\n" . "\n" . "\n" . "Sincerely,";
    $Message .= "\n" . "\n" . "The Conversion Worx Team";
    $result = mail($To, $Subject, $Message, $Headers);
}
 ?>

<?php

$errorCount = "";

$bizNameErr = $bizTypeErr = $address1Err = $address2Err = $cityErr = $stateErr
= $zipErr = $sqftErr = $cNameErr = $emailErr = "";

$bizName = $bizType = $address1 = $address2 = $city = $state
= $zip = $sqft = $cName = $email = "";
// Check to make sure the required fields from the Quote Form are not empty
if ($_SERVER["REQUEST_METHOD"] == "POST") {
  if (empty($_POST["bizName"])) {
    $bizNameErr = "Business name is required";
    ++$errorCount;
  } else {
    $bizName = test_input($_POST["bizName"]);
  } 
  if (empty($_POST["cName"])) {
    $cNameErr = "Contact Name is required";
    ++$errorCount;
  } else {
    $cName = test_input($_POST["cName"]);
  }
  if (empty($_POST["email"])) {
    $emailErr = "Email is required";
    ++$errorCount;
  } else {
    $email = test_input($_POST["email"]);
  }
  if (empty($_POST["bizType"])) {
    $bizTypeErr = "Business Type is required";
    ++$errorCount;
  } else {
    $bizType = test_input($_POST["bizType"]);
  }
  if (empty($_POST["address1"])) {
    $address1Err = "Address Line 1 is required";
    ++$errorCount;
  } else {
    $address1 = test_input($_POST["address1"]);
  }
   if (!empty($_POST["address2"])) {
    $address2 = test_input($_POST["address2"]);
  }
  if (empty($_POST["city"])) {
    $cityErr = "City is required";
    ++$errorCount;
  } else {
    $city = test_input($_POST["city"]);
  }
  if (empty($_POST["state"])) {
    $stateErr = "State is required";
    ++$errorCount;
  } else {
    $state = test_input($_POST["state"]);
  }
  if (empty($_POST["zip"])) {
    $zipErr = "Zip Code is required";
    ++$errorCount;
  } else {
    $zip = test_input($_POST["zip"]);
  }
  if (empty($_POST["sqft"])) {
    $sqftErr = "Square Feet is required";
    ++$errorCount;
  } else {
    $sqft = test_input($_POST["sqft"]);
  }   
}
// Form validation
function test_input($data) {
    $data = trim($data);
    $data = stripslashes($data);
    $data = htmlspecialchars($data);
    return $data;
}

Answer 1

У вас есть два варианта: проверка в браузере (через javascript / jQuery) или на сервере (PHP).

Если вы выберете маршрут PHP, страница будет изменяться или обновляться, любые данные, введенные в поля , будут потеряны, если вы не предпримете конкретные шаги для сохранения / извлечения / замены это.

javascript / jQuery route:

Если вы выберете маршрут javascript, вы можете прервать процесс отправки формы и обработать большинство (если не все) проверки поля формы. Если любое из полей не прошло проверку, вы можете не только вернуть управление пользователю со всеми данными, которые все еще in situ , вы также можете обратить их внимание на ошибки (например, путем добавление класса к пропущенному (ым) полю (ам), которое привлекает внимание, или всплывающее модальное диалоговое сообщение, или путем наведения курсора на пропущенное поле и т. д.)

PHP-маршрут:

Если вы выбираете маршрут PHP, как вы сохраняете / восстанавливаете пользовательские данные? С большим количеством ручного труда ... Вы можете:

1) Сохраните значения полей в localStorage , используя немного JavaScript. Это требует довольно много кодирования с вашей стороны, но это работает. Опять же, вы прервете процесс отправки формы и сохраните данные за мгновение до отправки формы.

2) В PHP получить все значения полей. Если какое-либо поле не проходит проверку, вы можете отправить пользователя (через директиву PHP headers?) Обратно на ту же страницу или на другую страницу вместе со всеми данными пользователя . Это означает либо создание новой страницы, либо добавление PHP-кода на вашу существующую страницу, для поиска этих значений, которые будут опубликованы, и, если они найдены, построение страницы таким образом, чтобы вы отображали форму с уже заполненными значениями. . Этот метод требует еще больше работы, чем первый.

Честно говоря, самый простой способ выполнить то, что вам нужно, это клиентская проверка полей на основе javascript - именно так 99% веб-сайтов справляются с этой ситуацией. Преимущества намного перевешивают любые недостатки. Если вас интересуют суперпользователи, использующие F12 DevTools для уловки проверки вашего поля, то у вас есть проверка резервных копий в PHP, которая не беспокоит сохранение данных формы (служит им правильно ...!) , Количество людей, попадающих в категорию хакеров, настолько мало и далеко, что вам действительно не нужно их обслуживать - но вам нужно перепроверить на стороне PHP, просто не беспокойтесь о сохранении их данных. Позаботьтесь об этом на стороне JavaScript

См. Эти ресурсы:

Как направить пользователя непосредственно в форму