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

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

ОБСУЖДЕНИЕ

Обратная связь для сайта

Обратная связь на JQuery, PHP и MySQL
Просмотров: 2201  Скачан: 275 раз  Комментариев в теме: 1

Красивая обратная связь на PHP, JQuery и MySQL для вашего сайта. В форме реализована проверка полей, сообщение об ошибке и база данных для хранения присылаемых вам писем, это очень удобно, если вы вдруг удалите важное для вас сообщение присланное ранее на почту, то вам не составит труда заглянуть в БД и прочесть его снова, да и вообще вести учёт присылаемых писем и хранить их в БД, это отличный выход для информационного портала.

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

 

HTML

<div id="contact">
    <h1>Обратная связь</h1>
    <form id="ContactForm" action="">
        <p>
            <label>Имя</label>
            <input id="name" name="name" class="inplaceError" maxlength="120" type="text" autocomplete="off"/>
            <span class="error" style="display:none;"></span>
        </p>
        <p>
            <label>Email</label>
            <input id="email" name="email" class="inplaceError" maxlength="120" type="text" autocomplete="off"/>
            <span class="error" style="display:none;"></span>
        </p>
        <p>
            <label>Сайт<span>(коротко)</span></label>
            <input id="website" name="website" class="inplaceError" maxlength="120" type="text" autocomplete="off"/>
        </p>
        <p>
            <label>Сообщение<br /> <span>не больше 1000 символов</span></label>
            <textarea id="message" name="message" class="inplaceError" cols="6" rows="5" autocomplete="off"></textarea>
            <span class="error" style="display:none;"></span>
        </p>
        <p class="submit">
            <input id="send" type="button" value="отправить"/>
            <span id="loader" class="loader" style="display:none;"></span>
            <span id="success_message" class="success"></span>
        </p>
        <input id="newcontact" name="newcontact" type="hidden" value="1"></input>
    </form>
</div>
<div class="envelope">
    <img id="envelope" src="images/envelope.png" alt="envelope" width="246" height="175" style="display:none;"/>
</div>

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

 

CSS

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

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

 

JS

<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="js/jquery.contact.js"></script>

Теперь, что касается базы данных и электронной почты, все эти параметры задаются в файле php/config.php, для БД в исходниках прилагается файл contact.sql, это таблица, легче всего установи её через phpMYAdmin.

Материалы по теме:

Фиксированная форма обратной связи на PHP и jQueryФиксированная форма обратной связи ...

Довольно простая форма обратной связи без капчи, проверки полей, сообщений об ошибке и всего прочего......

Прозрачная контактная форма на css3Прозрачная контактная форма на css3

Прозрачная контактная форма на CSS3 в тёмном стиле. В форме реализована проверка полей......

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

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

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

Универсальная форма обратной связи написанная на PHP, JS, CSS, MySQL, AJAX. Форма довольно гибкая в возможностях, с помощью админки......

Обратная связь на JQuery, PHP и MySQLОбратная связь на JQuery, PHP и MyS...

Красивая форма обратной связи на PHP/JQuery и MySQL. В форме реализована проверка полей, сообщение об ошибке и база данных для хранения присылаемых ва...

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

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

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

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

Вертикальное меню с прокруткой на JQueryВертикальное меню с прокруткой на JQuery

Меню с прокруткой, реализованое с помощью jquery, главная особенность такого меню......

Оригинальное меню в виде клочка бумагиОригинальное меню в виде клочка бумаги

Меню в оригинальном стиле, в виде потёртого клочка бумаги....

Набор плоских форм «Formicon Flat Forms Pack»Набор плоских форм «Formicon Flat Forms ...

Formicon Flat Forms Pack - это набор плоских форм, построенных на Bootstrap 3.0. Набор содержит в себе различные формы и все они имеют разные стили...

GridoGrido

Много функциональный шаблон Grido, шаблон обладает огромным набором возможностей его настройки....

Горизонтальное меню на jQuery «Menu Kwicks»Горизонтальное меню на jQuery «Menu Kwic...

Стильное горизонтальное меню с выдвижными иконками

Набор элементов дизайна «CSS3 Responsive Forms Pack»Набор элементов дизайна «CSS3 Responsive...

Это профессиональный набор элементов дизайна ( кнопки, формы, Checkbox и многое другое)....

Полноэкранное меню на css и JQueryПолноэкранное меню на css и JQuery

Полно-экранное меню на css и Jquery с меняющимся фоном....
  • Текущий 1.60/5
  • 1
  • 2
  • 3
  • 4
  • 5

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

Комментариев в теме: (1)
↑ 0 ↓
Павел
Как-то не работает проверка полей. Просто крутится колесико и все.
Ответить Ответ с цитатой

Страницы: 1

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


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