Реализация LeanModal с PHP - PullRequest
Новая
       1

Реализация LeanModal с PHP

0 голосов
/ 28 октября 2011

Как вызвать функцию LeanModal при нажатии кнопки «Отправить», чтобы сообщить пользователю, является ли какое-либо из полей заполнения недействительным или форма была успешно отправлена.

Когда нажата кнопка отправки / отправки:

  • проверить обработчик событий PHP на том же листе
  • Показать результат на LeanModal
    • Если это успешно, то текст отображается в модальном, все поля в форме являются пустыми.
    • Если нет, то текст отображается модально, недопустимые поля в формах подсвечиваются.

Это все файлы, которые относятся к contact.php:

  1. contact.php (основной лист, над которым я работал)
  2. validate.php (импортируется в contact.php для проверки полей формы)
  3. validate.js (функции в этом файле были вызваны в contact.php)
  4. Leanmodal.js

contact.php: 

<head>
<script type="text/javascript">
$(function() {
$('a[rel*=leanModal]').leanModal();     
});

</script>
</head>

<body>
<div id="content">

<?if( isset($_POST['send']) && (!validateName($_POST['name']) || !validateSurname($_POST['surname']) || !validateEmail($_POST['email']) || !validateMessage($_POST['message']) || !validateHuman($_POST['human']) ) ):?>  

<div id="error">  
   <ul>  
   <?if(!validateName($_POST['name'])):?>  
      <li><strong>Invalid Name:</strong>Required more than 3 letters!</li>  
   <?endif?>  
   <?if(!validateSurname($_POST['surname'])):?>  
      <li><strong>Invalid Surname:</strong>Required more than 3 letters!</li>  
   <?endif?>  
   <?if(!validateEmail($_POST['email'])):?>  
      <li><strong>Invalid E-mail:</strong>Invalid email-address format!</li>  
   <?endif?>
   <?if(!validateMessage($_POST['message'])):?>  
      <li><strong>Invalid Message:</strong>Required more than 3 letters</li>  
   <?endif?>  
   <?if(!validateHuman($_POST['human'])):?>  
      <li><strong>Answer Incorrect:</strong>Human Validation Failed</li>  
   <?endif?>   
  </ul>  

</div> 

   <?elseif(isset($_POST['send'])):?>  
   <div id="error" class="valid">  
     <ul>  
       <li><strong>Congratulations!</strong></li>  
     </ul>  
   </div>  
   <?endif?>

<form method="post" id="customForm" action="contact.php">
   .
   .
   .
<input id="send" name="send" type="submit" value="Send" />
</form>

<script type="text/javascript" src="js/validation.js"></script>

</div>
</body>

1 Ответ

0 голосов
/ 28 октября 2011

Ваш вопрос до сих пор мне не совсем понятен, поэтому я сделаю некоторые предположения при ответе.Я не знаком с LeanModal, поэтому, возможно, стоит проверить документы для этого.(Могу ли я предложить вам добавить «jquery» в ваши теги, так как это выглядит как вопрос jquery?).

Кажется, у вас есть система проверки на основе PHP, но вы хотите отображать свои ошибки, используя JavaScript,Вы не упомянули об этом, но это похоже на кандидата на работу с AJAX, что легко сделать в jQuery.Вам нужно зафиксировать событие нажатия на отправку вашей формы, таким образом: 

$(document).ready(function() {
    $('#send).click(function() {
        // Do ajax op here

        return false;
    });
});

Как вы можете видеть, оно настроено вместо события готовности DOM;и вам нужно будет отправить содержимое вашей формы на сервер, чтобы правильно ее проверить ( начать здесь ).Кажется, я помню, что есть отличный плагин форм для jQuery, который сделает это за вас - зацените его (или вы можете получить значения в форме вручную).

Результат проверки, вероятно, вернет JSON-ответкоторый при получении в jQuery покажет либо модальное диалоговое окно, либо div, который говорит, что все в порядке.

Если мои предположения о дизайне верны, попробуйте это - и дайте нам знать, как вы ладите.Возможно, вам придется заняться веб-поиском или задать дополнительные вопросы, так как здесь есть, с чем столкнуться: -)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...