Форум программистов, компьютерный форум, киберфорум
JavaScript
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.60/5: Рейтинг темы: голосов - 5, средняя оценка - 4.60
0 / 0 / 0
Регистрация: 11.08.2016
Сообщений: 21

Не работает форма обратной связи

15.08.2016, 23:16. Показов 1027. Ответов 1
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Всем доброго времени суток.
Не корректно работает AJAX форма обратной связи в модальном окне. При отправить данные, все время пишет - Сообщение не отправлено, убедитесь в правильности заполнение полей.
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<div class="overlay"></div>
    <div class="popup">
        <div class="close_modal">x</div>
        <form class="fofm" action="">
            <h5>Форма обратной связи</h5>
            <input type="text" required="" placeholder="Имя" name="txtname">
            <input type="email" placeholder="Email" name="txtemail">
            <input type="tel" pattern="^((8|\+7)[\- ]?)?(\(?\d{3}\)?[\- ]?)?[\d\- ]{7,10}$" required="" placeholder="Телефон" name="txtphone">
            <textarea name="txtmessage" placeholder="Описание" rows="10"></textarea>
            <label><input type="checkbox">Я не робот</label>
            <input type="hidden" name="valTrFal" class="valTrFal" value="valTrFal_disabled">
            <input type="submit" class="button" value="Отправить" disabled="disabled" name="btnsend">
        </form>
    </div>
 
    <div class="popup2">
    <div class="close_modal">x</div>
        <div class="window">
            <div class="insText">
                <h5>запрос отправлен</h5>
                <p><strong>Ваш запрос отправлен.</strong>Наш менеджер свяжется с вами в ближайшее время!</p>
                <hr>
                <p>Предлагаем подробную информацию по продукции:</p>
            </div>
        </div>
    </div>
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
.open_modal{
    position: relative;
    bottom: 41px;
    left: 402px;
    width: 180px;
    height: 100px;
    background-color: #fc2b2b;
    border: #12a0b3 3px solid;
    border-radius: 10px;
    text-align: center;
    font-size:22px;
    color:white;
    padding-top: 19px;
    font-weight: bold;
}
 
.open_modal:hover {
    border:#ccc 3px solid;
    cursor:pointer;
}
 
.overlay {
    background-color: rgba(0, 0, 0, 0.7);
    bottom: 0;
    cursor: default;
    left: 0;
    opacity: 0;
    position: fixed;
    right: 0;
    top: 0;
    visibility: hidden;
    z-index: 99999;
    -webkit-transition: opacity .5s;
    -moz-transition: opacity .5s;
    -ms-transition: opacity .5s;
    -o-transition: opacity .5s;
    transition: opacity .5s;
}
.popup, .popup2{
    display: inline-block;
    left: 50%;
    opacity: 0;
    position: fixed;
    text-align: justify;
    top: 40%;
    visibility: hidden;
    z-index: 999999;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transition: opacity .5s, top .5s;
    -moz-transition: opacity .5s, top .5s;
    -ms-transition: opacity .5s, top .5s;
    -o-transition: opacity .5s, top .5s;
    transition: opacity .5s, top .5s;
}
.popup form {
    padding: 0 27px 20px;
    right: 0;
    width: 290px;
    background: rgba(255, 255, 255, 0.85);
    border-radius: 5px;
    border: 1px solid #72bffc;
    border-top: 40px solid #72bffc;
}
.popup2 .window {
    padding: 0 27px 27px;
    right: 0;
    width: 373px;
    background: rgba(255, 255, 255, 0.85);
    border-radius: 5px;
    border: 1px solid #72bffc;
    border-top: 40px solid #72bffc;
}
.popup form input {
    background: #f0f5f7;
    margin-top: 8px;
    width: 227px;
}
.popup form input[name="txtname"]{
    margin-top: 20px;
}
.popup form textarea {
    background: #f0f5f7;
    margin-top: 8px;
    width: 227px;
    height: 100px;
    resize: none;
}
.popup form label{
    width: 100%;
    height: 20px;
    display: block;
    margin: 8px -2px;
    padding: 0;
}
.popup form input[type="submit"] {
    background: #ee7156;
    text-align: center;
    text-transform: uppercase;
    width: 245px;
}
.popup form input[type="checkbox"] {
    width: auto;
    margin: 2px;
    padding: 2px;
    float: left;
}
.popup form h5 {
    position: absolute;
    top: 10px;
    left: 29px;
    font-size: 18px;
    color: white;
    font-weight: normal;
    text-transform: uppercase;
    margin: 0;
}
.popup .close_modal,
.popup2 .close_modal  {
    position: absolute;
    padding: 1px 9px 4px 9px;
    top: -15px;
    right: -15px;
    cursor: pointer;
    color: #fff;
    font-family: 'tahoma', sans-serif;
    background: #ee7156;
    text-align: center;
}
.popup2 h5 {
    position: absolute;
    top: 10px;
    left: 120px;
    font-size: 18px;
    color: white;
    font-weight: normal;
    text-transform: uppercase;
    margin: 0;
}
.popup2 p {
    font-family: verdana;
    font-size: 18px;
    line-height: 24px;
    text-align: center;
}
.popup2 p strong{
    font-size: 26px;
    line-height: 30px;
    font-weight: normal;
    display: block;
}
.popup2 hr {
    background: #63baff;
    height: 1px;
    border: none;
}
JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
jQuery(document).ready(function($){
 
    //в этой функции отслеживается изменение чекбокса "я не робот"
    $(document).on('change', '.fofm input:checkbox', function() {
        if($(this).is(':checked')){
            $(".fofm input[type=submit]").removeAttr('disabled');
            $('.fofm input[type=hidden].valTrFal').val('valTrFal_true');
        }
        else {
            $(".fofm input[type=submit]").attr('disabled','disabled');
            $('.fofm input[type=hidden].valTrFal').val('valTrFal_disabled');
        }
    });
 
    //закрытие модального окна
    $('.close_modal, .overlay').click(function (){
        $('.popup, .popup2, .overlay').css({'opacity':'0', 'visibility':'hidden'});
        $('.popup > .fofm textarea').val('');
        //сброс всех полей формы обраной связи
        $(':input','.fofm').not(':button, :submit, :reset, :hidden').val('').removeAttr('checked').removeAttr('selected');
        $(".fofm input[type=submit]").attr('disabled','disabled');
    });
 
    //показ модального окна
    $('.open_modal').click(function (e){
        e.preventDefault();
        $('.popup, .overlay').css({'opacity':'1', 'visibility':'visible'});
    });
 
    //аякс форма обратной связи
    //проверяет какой ответ был получен
    //и в зависимости от ответа
    //выводит информацию о статусе
    //отправки письма
    $(".fofm").submit(function() {
        var str = $(this).serialize();
        $.ajax({
            type: "POST",
            url: "php/contact.php",
            data: str,
            success: function(msg) {
                if(msg == 'ok') {
                    $('.popup2, .overlay').css('opacity','1');
                    $('.popup2, .overlay').css('visibility','visible');
                    $('.popup').css({'opacity':'0','visibility':'hidden'});
                }
                else {
                    $('.popup2 .window').html('<h5>Ошибка</h5><p>Сообщение не отправлено, убедитесь в правильности заполнение полей</p>');
                    $('.popup2, .overlay').css('opacity','1');
                    $('.popup2, .overlay').css('visibility','visible');
                    $('.popup').css({'opacity':'0','visibility':'hidden'});
                }
            }
        });
        return false;
    });
 
});
0
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
15.08.2016, 23:16
Ответы с готовыми решениями:

Форма обратной связи
Добрый день) Подскажите пожалуйста можно ли создать форму обратной связи на странице без использования php или jqwery, а только html, css,...

Форма обратной связи
Добрый день, у меня есть скрипт формы обратной связи, подскажите, можете подсказать, как сделать так, чтобы ошибки выводились не в alert? с...

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

1
 Аватар для Jetlag
111 / 49 / 20
Регистрация: 21.10.2013
Сообщений: 212
16.08.2016, 11:15
Не верьте форме обратной связи, она вас цинично обманывает! Сообщение отправлено, только ответ вам приходит наверняка не такой как она ожидает
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
16.08.2016, 11:15
Помогаю со студенческими работами здесь

Форма обратной связи
Ребята помогите, мой сайт зареган на народ.ру, там php не поддерживает. Можно как то на java создать тайну форму.

Форма обратной связи
Приветствую всех, вопрос возник. Можно ли форму обратной связи отправить без php? На js

Форма обратной связи. Ошибка
Всем привет. Делал форму обратной связи без перезагрузки страницы по уроку в интернете. $(document).ready(function() { // Форма...

Форма обратной связи через js
Добрый день уважаемые форумчане. Имеется сайт http://екббухгалтер.рф , по адресу...

Форма обратной связи – неверная кодировка
Помогите пожалуйста, не знаю как исправить( в самом начале body написанно &lt;div id=&quot;contactable&quot;&gt;&lt;!-- contactable html...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
2
Ответ Создать тему
Новые блоги и статьи
1С: Программный отбор элементов справочника по группе
Maks 22.03.2026
Установка программного отбора элементов справочника "Номенклатура" из модуля формы документа. В качестве фильтра для отбора справочника служит группа номенклатуры. Отбор по наименованию группы. . .
Как я обхитрил таблицу Word
Alexander-7 21.03.2026
Когда мигает курсор у внешнего края таблицы, и нам надо перейти на новую строку, а при нажатии Enter создается новый ряд таблицы с ячейками, то мы вместо нервных нажатий Энтеров мы пишем любые буквы. . .
Krabik - рыболовный бот для WoW 3.3.5a
AmbA 21.03.2026
без регистрации и смс. Это не торговля, приложение не содержит рекламы. Выполняет свою непосредственную задачу - автоматизацию рыбалки в WoW - и ничего более. Однако если админы будут против -. . .
1С: Программный отбор элементов справочника по значению перечисления
Maks 21.03.2026
Установка программного отбора элементов справочника "Сотрудники" из модуля формы документа. В качестве фильтра для отбора служит значение перечислений. / / Событие "НачалоВыбора" реквизита на форме. . .
Переходник USB-CAN-GPIO
Eddy_Em 20.03.2026
Достаточно давно на работе возникла необходимость в переходнике CAN-USB с гальваноразвязкой, оный и был разработан. Однако, все меня терзала совесть, что аж 48-ногий МК используется так тупо: просто. . .
Оттенки серого
Argus19 18.03.2026
Оттенки серого Нашёл в интернете 3 прекрасных модуля: Модуль класса открытия диалога открытия/ сохранения файла на Win32 API; Модуль класса быстрого перекодирования цветного изображения в оттенки. . .
SDL3 для Desktop (MinGW): Рисуем цветные прямоугольники с помощью рисовальщика SDL3 на Си и C++
8Observer8 17.03.2026
Содержание блога Финальные проекты на Си и на C++: finish-rectangles-sdl3-c. zip finish-rectangles-sdl3-cpp. zip
Символические и жёсткие ссылки в Linux.
algri14 15.03.2026
Существует два типа ссылок — символические и жёсткие. Ссылка в Linux — это запись в каталоге, которая может указывать либо на inode «файла-ИСТОЧНИКА», тогда это будет «жёсткая ссылка» (hard link),. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru