qiwi
ПОСЛЕДНИЕ ПУБЛИКАЦИИ
ПОДПИСКА
Будь В Курсе
Подпишись, и получай эксклюзивные обновления на свой E-Mail:

Ваш E-Mail полностью защищён

ОБСУЖДЕНИЕ

Обратная связь на PHP и JQuery

Обратная связь на PHP и JQuery
Просмотров: 1568  Скачан: 211 раз  Комментариев в теме: 0

Стильная обратная связь ( LightForm) для сайта на PHP, Ajax и JQuery. Форма использует FormCheck2 для проверки полей , NiceForms для стилей текстовых полей и полей текстового ввода, Ajax для отправки без перезагрузки страницы. Если вы ищите для своего проекта, что-то простое и в же время практичное, то эта форма вам подойдёт, в ней есть все что надо. Проверка полей, капча, сообщение о допустимых ошибках. Вам на почту помимо сообщения пользователя, приходит и краткая информация о нем ( IP пользователя, используемый браузер и его версия, платформа и адрес страницы с которой отправлялось сообщение).

Шаг 1 - создание разметки

 

HTML и PHP

<?php
$headers = 'Content-type: text; charset=utf-8';
$to = 'mail@mail.ru'; //ТУТ УКАЗЫВАЕМ СВОЙ EMAIL
$name = stripslashes($_POST['name']);
$email = stripslashes($_POST['email']);
$website = stripslashes($_POST['website']);
$subject .= stripslashes($_POST['subject']);
$msg  = "Имя : $name \r\n";
$msg .= "Email : $email \r\n";
$msg .= "Сайт : $website \r\n";
$msg .= "Тема : $subject \r\n\n";
$msg .= "Сообщение \r\n".stripslashes($_POST['message'])."\r\n\n";
$msg .= "Информация \r\n";
$msg .= "IP пользователя : ".$_SERVER["REMOTE_ADDR"]."\r\n";
$msg .= "Браузер : ".$_SERVER["HTTP_USER_AGENT"]."\r\n";
$msg .= "Страница отправки : ".$_SERVER["HTTP_REFERER"];
    if ($_SERVER['REQUEST_METHOD'] != 'POST'){
        $self = $_SERVER['PHP_SELF'];
?>
<form name="form" method="post" id="third" action="<?php echo $self;?>"  class="niceform">
    <h1>Форма обратной связи</h1>
    <label for="name"><strong><span class="blue">*</span> Имя : </strong></label>
        <input id="name" name="name" type="text" class="validate['required','length[3,-1]','nodigit']" size="20" />
    <label for="email"><strong><span class="blue">*</span> Email : </strong></label>
        <input id="email" name="email" type="text" class="validate['required','length[5,-1]','email']" size="20" />
    <label for="site">Ваш сайт : </label>
        <input id="website" name="website" type="text" class="validate['url']" size="20" />
    <label for="subject"><strong><span class="blue">*</span> Тема письма: </strong></label>
        <input id="subject" name="subject" type="text" class="validate['required']" size="20" />
    <label for="msg"><strong><span class="blue">*</span> Ваше сообщение : </strong></label><br />
        <textarea id="message" name="message" type="text" class="validate['required']" rows="10" cols="30"></textarea>
    <label for="spamcheck"><span class="blue">*</span> <acronym  title="[ Spam prevention ]"><strong>Докажи что ты человек</acronym> : <span class="blue">2 + 3 = ???</span></strong></label>
        <input id="spamcheck" name="spamcheck" type="text" size="5" class="validate['required','number','spamcheck']" />
        <br /><br />
    <input type="submit" class="buttonSubmit" value="Send it!" />
    <div id="stylesheetTest"></div>
</form>    
<?php
} else
    {
        error_reporting(0);
        if  (mail($to, $subject, $msg, $headers, "From: $email\r\nReply-To: $email\r\nReturn-Path: $email\r\n"))
        echo nl2br("
            <div class=\"MsgSent\">
                <h1>Поздравляем!</h1>
                <p>Спасибо <b><?=$name;?></b>, ваше сообщение отправлено!<br /> Как только оно будет обработано вы получите ответ.</p>
            </div>
        ");
        else
        echo "
        <div class=\"MsgError\">
            <h1>Ошибка!!</h1>
            <p>Извините <b><?=$name;?></b>, ваше сообщение не отправлено. Попробуйте отправить его позже!</p>
        </div>";
    }
?>

Шаг 2 - подключение стилей

 

CSS

<link rel="stylesheet" href="css/style.css" type="text/css" />

Шаг 3 - подключение JavaScript

 

JS

<script type="text/javascript" src="js/mootools.js"></script>
<script type="text/javascript" src="js/formcheck.js"></script>
<script type="text/javascript" src="js/niceforms.js"></script>
<script type="text/javascript">
window.addEvent('domready', function(){check = new FormCheck('third', {
    display : {
        fadeDuration : 500,
        errorsLocation : 1,
        indicateErrors : 1,
        showErrors : 1
    }
})});
</script>
Материалы по теме:

Прозрачная форма регистрации с прогресс баромПрозрачная форма регистрации с прог...

Стильная прозрачная форма регистрации на css3 и JQuery. В форме имеется прогресс бар показывающий пользователю процесс заполнения формы....

Обратная связь на PHP и JQuery «LightForm»Обратная связь на PHP и JQuery «Lig...

Стильная обратная связь ( LightForm) на PHP, Ajax и JQuery. Форма использует FormCheck2 для проверки полей , NiceForms для стилей текстовых полей и.....

Фиксированная форма обратной связи «Contactable 1.5»Фиксированная форма обратной связи ...

Стильная форма обратной связи, а если быть точнее то это jquery плагин Contactable v1.5, который работает на AJAX и имеет встроенную проверку полей на...

Форма обратной связи на PHP, AJAX, JSФорма обратной связи на PHP, AJAX, ...

Красивая форма обратной связи для вашего сайта на php, ajax и js. Форма может похвастаться капчей, проверкой полей формы на валидность и сообщениях об...

Фиксированная контактная форма на css и JQueryФиксированная контактная форма на c...

Большинство контактных форм встречаемых на разных ресурсах, выглядят не очень то и захватывающе, по сути везде используются статичные формы, поэтому.....

Оригинальная анимационная контактная формаОригинальная анимационная контактна...

Оригинальная анимационная контактная форма, в довольно привлекательном стиле. Форма представлена в виде открытого конверта, при наведении курсора мыши...

Красивая форма обратной связи на PHP, CSS, JQueryКрасивая форма обратной связи на PH...

Красивая форма обратной связи на php css и jquery, к форме применены плагины formValidator (для проверка введённых значений), jQTransform (для стилиз...
Интересные публикации:

Стильный комплект форм «Zi-4-Forms»Стильный комплект форм «Zi-4-Forms»

Zi-4-Forms - это комплект форм использующий CSS3, комплект состоит с формы входа, регистрации, восстановления пароля, контактная форма....

Шаблон Desire Night ClubШаблон Desire Night Club

HTML шаблон ночного клуба, на главной странице располагается привлекательный слайдер, есть галерея, видео проигрыватель, заготовлена контактная форма ...

Скроллер картинокСкроллер картинок

Красивый скроллер для вашего сайта, имеет возможность прокручиваться как в левую сторону, так и в правую......

Оригинальная анимационная контактная формаОригинальная анимационная контактная фор...

Оригинальная анимационная контактная форма, в довольно привлекательном стиле. Форма представлена в виде открытого конверта, при наведении курсора мыши...

Круглая кнопка с анимационным фоном на css3Круглая кнопка с анимационным фоном на c...

Красивая кнопка на css3, анимация фона происходит при наведении курсора на кнопку....

4Images 1.7.11 RUS4Images 1.7.11 RUS

Это отличная фото-галерея с довольно сильным функционалом....

Слайдер картинок на JqueryСлайдер картинок на Jquery

Отличный слайдер картинок для вашего сайта с поддержкой слайд-шоу, также в слайдере имеются две кнопки......
  • Текущий 1.00/5
  • 1
  • 2
  • 3
  • 4
  • 5

Рейтинг: 1.0/5( Голосов 8 )

Комментариев в теме: (0)

Авторизация:
YandexGoogleVKMail.ruTwitterFacebookOdnoklassniki


Ваше имя:
Сайт:
Ваша почта:
RSS
Комментарий:
Введите символы:
captcha
Обновить