Все технические форумы на одном сайте Удобный поиск информации с популярных форумов в одном месте
Вопрос: Как узнать $RESULT_ID после того как пользователь заполнил форму и отправил ее в базу

Здравствуйте. Подскажите пожалуйста как узнать $RESULT_ID созданного пользователем результата который получился после того как пользователь заполнил форму и нажал кнопку "отправить". Этот $RESULT_ID который подставляется в метод

PHP
1
2
3
4
5
arAnswer = CFormResult::GetDataByID(
    $RESULT_ID, 
    array(),  
    $arResult, 
    $arAnswer2);
Ответ: вы же добаляете результат в форму, значит и id имеете
PHP
1
2
3
4
5
6
$RESULT_ID = CFormResult::Add($form_id, $arFormValues);
$arAnswer = CFormResult::GetDataByID(
    $RESULT_ID, 
    array(),  
    $arResult, 
    $arAnswer2);
Вопрос: Как отправить НЕ все поля формы?

Может и примитивный вопрос, но - не нагуглил ничего.
Если мне нужно отправить на сервер значения не всех полей формы, а лишь часть из них (остальные - обрабатываются непосредственно на клиенте) - можно ли это как-нибудь осуществить? Я имею в виду ЯВНО ВИДИМЫЕ поля, не hidden'ы
Ответ: neznajka,

Ajax чем не устраивает!?
Вопрос: Ошибка с формой

Проблема с формой отправки.
Собственно на сайте несколько форм с разными переменными, в конце скрипт Передает переменные с форм в переменные "name" и "tel" и их уже подхватывает пхп forms.php.
Вроде все правильно, но все время выдает ошибку что возможно я не правильно заполнил форму...
Помогите пожалуйста.
php:
Код PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<?
if((isset($_POST['name'])&&$_POST['name']!="")&&(isset($_POST['tel'])&&$_POST['tel']!="")){ //Проверка отправилось ли наше поля name и не пустые ли они
        $to = 'divanya@bk.ru'; //Почта получателя, через запятую можно указать сколько угодно адресов
        $subject = 'Обратный звонок'; //Загаловок сообщения
        $message = '
                <html>
                    <head>
                        <title>'.$subject.'</title>
                    </head>
                    <body>
                        <p>Имя: '.$_POST['name'].'</p>
                        <p>Телефон: '.$_POST['tel'].'</p>                        
                    </body>
                </html>'; //Текст нащего сообщения можно использовать HTML теги
        $headers  = "Content-type: text/html; charset=utf-8 \r\n"; //Кодировка письма
        $headers .= "From: Отправитель <from@example.com>\r\n"; //Наименование и почта отправителя
        mail($to, $subject, $message, $headers); //Отправка письма с помощью функции mail
}
?>
Сама форма:
Код 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
<div id="popup11" class="popup11" >
        <div id="btn-close" class="f-close"> </div>
        <div class="header">ЗАКАЗАТЬ ЗВОНОК</div>
        <div class="p1_msg">
            Заполните форму, чтобы получить
                консультацию специалиста.
        </div>
        <input class="pop_name1" type="text" value='Ваше имя' onclick="if ($('.pop_name1').val()=='Ваше имя'){ $('.pop_name1').val('');} $('.pop_name1').css('color','#000000');" >
        <input class="pop_tel1" type="text" value='Телефон' onclick="if ($('.pop_tel1').val()=='Телефон'){ $('.pop_tel1').val('');} $('.pop_tel1').css('color','#000000');" >
        <a  id="callback-send11" class="btn b_red" onclick="goalEvent('order_success');">ОТПРАВИТЬ</a>
 
    </div>
 
 
    
 
    <div id="spasibo" class="spasibo" >
        <div class="header">СПАСИБО!</div>
        <div class="p1_msg">
            Ваша заявка отправлена успешно.
        </div>
 
        <a  id="callback-spasibo" class="btn b_red">ЗАКРЫТЬ</a>
 
    </div>
Еще 1 поле:
Код HTML5
1
2
3
4
5
                <div class="zakaz_sk">
                    <input class="s_name" type="text" value="" placeholder="Ваше имя" >
                    <input class="s_tel" type="text" value="" placeholder="Телефон" >
                    <a id="callback-send2" class="btn b_red">ЗАКАЗАТЬ</a>
                </div>
js:
Код 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
59
            $(function() {
                $('#callback-send11').click(function(){
                    
                    var name=$('.pop_name1').val();
                    var tel=$('.pop_tel1').val();
                
                    if(!name.length || name == 'Ваше имя' || !tel.length || tel == 'Телефон'){
                        alert ('Ошибка при отправлении. Возможно Вы неправильно заполнили поля.');
                        return false;
                    } else {
                
                        $.ajax({
                            type: "POST",
                            url: "forms.php",
                            data: "name="+name+"&tel="+tel+'&f=popup11',
                            success: function(data){
                                if (data=='ok'){
                                    //alert ('Заявка успешно отправлена');
                                    $('#popup11').fadeOut(300);
                                    $('.pop_name1').val('');
                                    $('.pop_tel1').val('');
                                    $('#spasibo').fadeIn(300);
                                }else{
                                    alert ('Ошибка при отправлении. Возможно Вы неправильно заполнили поля.');
                                };
                            }
                         });
                    }
                });
 
                $('#callback-send1').click(function(event) {
                    var name=$('.pop_name').val();
                    var tel=$('.pop_tel').val();
 
                    if(!name.length || name == 'Ваше имя' || !tel.length || tel == 'Телефон'){
                        alert ('Ошибка при отправлении. Возможно Вы неправильно заполнили поля.');
                        return false;
                    } else {
                        $.ajax({
                               type: "POST",
                               url: "forms.php",
                               data: "name="+name+"&tel="+tel+'&f=popup1',
                               success: function(data){
                                    if (data=='ok')
                                    {
                                        //alert ('Заявка успешно отправлена');
                                        $('#popup1').fadeOut(300);
                                        $('.pop_name').val('');
                                        $('.pop_tel').val('');
                                        $('#spasibo').fadeIn(300);
 
                                    }else{
                                        alert ('Ошибка при отправлении. Возможно Вы неправильно заполнили поля.');
                                    };
                                }
                         });
                     }
                     
                });
Ответ: Я немного переделал.

Ваши формы:

Код HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<div id="popup11" class="popup11" >
 <div id="btn-close" class="f-close"> </div>
 <div class="header">ЗАКАЗАТЬ ЗВОНОК</div>
 <div class="p1_msg">Заполните форму, чтобы получить консультацию!</div>
 
 <input class="pop_name1" type="text" placeholder="Ваше имя">
 <input class="pop_tel1" type="text" placeholder="Телефон">
 <a id="callback-send11" class="btn b_red">ОТПРАВИТЬ</a>
</div>
 
<div class="zakaz_sk" id="popup22">
 <input class="s_name" type="text" value="" placeholder="Ваше имя" >
 <input class="s_tel" type="text" value="" placeholder="Телефон" >
 <a id="callback-send2" class="btn b_red">ЗАКАЗАТЬ</a>
</div>
Ваш JS:

Код 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
$(function() {
    $('#callback-send11').click(function(){
        var name=$('.pop_name1').val();
        var tel=$('.pop_tel1').val();
        
        if(!name.length || name == 'Ваше имя' || !tel.length || tel == 'Телефон') {
            alert ('Ошибка при отправлении. Возможно Вы неправильно заполнили поля.');
            return false;
        } else {
                $.ajax({
                    type: "POST",
                    url: "forms.php",
                    data: "name="+name+"&tel="+tel+'&f=popup11',
                    success: function(data){
                        if (data=='ok'){
                            alert ('Заявка успешно отправлена');
                            $('#popup11').fadeOut(300);
                            $('.pop_name1').val('');
                            $('.pop_tel1').val('');
                            $('#spasibo').fadeIn(300);
                        }
                        else {
                            alert ('Ошибка при отправлении. Возможно Вы неправильно заполнили поля.');
                        };
                    }
                });
        }
    });
    
    $('#callback-send2').click(function() {
        var name = $('.s_name').val();
        var tel = $('.s_tel').val();
        
        if(!name.length || name == 'Ваше имя' || !tel.length || tel == 'Телефон') {
            alert ('Ошибка при отправлении. Возможно Вы неправильно заполнили поля.');
            return false;
        } 
        else {
            $.ajax({
                type: "POST",
                url: "forms.php",
                data: "name="+name+"&tel="+tel+'&f=popup22',
                success: function(data){
                    if (data=='ok') {
                        alert ('Заявка успешно отправлена');
                        $('.zakaz_sk').fadeOut(300);
                        $('.s_name').val('');
                        $('.s_tel').val('');
                        $('#spasibo').fadeIn(300);
                    }
                    else {
                        alert ('Ошибка при отправлении. Возможно Вы неправильно заполнили поля.');
                    };
                }
            });
        }
    });
});
Если что-то дальше не получается - пишите помогу.
Вопрос: Разместить форму по центру

Всем добрый день. Пытаюсь вникнуть в Bootstrap.
Сейчас решил разработать форму, получилось как-то ... странно. Но суть в том , что она у меня не хочет централизироваться.

Так же может кто то может дать совет или показать как лучше всего такую форму реализовывать. Т.к. не нашел нигде
шаблонов на горизонтальную и вертикальную форму сразу вместе.

Картинка как сейчас выглядит форма загружена во вложения.

Сам код формы :
Код 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
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
<div class="container">
                      <h2 style="color:#FF0000">
                       Create YOUR PERSONAL form bootstrap HERE!
                      </h2>
                   
                       <form role="form" class="form-horizontal" >
   
    <div class="form-group">
        <div class="col-sm-3">
          <label>Name</label>
          <input type="text" class="form-control" placeholder="Name">
        </div>
 
      <div class="col-sm-3"><label>Last name</label><input type="text" class="form-control" placeholder="First"></div>
    </div>
      <div class="form-group">
       <div class="col-sm-3"><label>Email</label><input type="text" class="form-control" placeholder="Email"></div>
        <div class="col-sm-3"><label>Phone</label><input type="text" class="form-control" placeholder="Phone"></div>
        </div>
         <div class="form-group">
       <div class="col-sm-3"><label>Zipcode</label><input type="text" class="form-control" placeholder="Zipcode"></div>
        <div class="col-sm-3"><label>Address</label><input type="text" class="form-control" placeholder="Address"></div>
        </div>
         <div class="form-group">
       <div class="col-sm-3"><label>City</label><input type="text" class="form-control" placeholder="City"></div>
        <div class="col-sm-3"><label>Birthplace</label><input type="text" class="form-control" placeholder="Birthplace"></div>
        </div>
        <div class="form-group">
   <div class="col-xs-3">
   <label>Gender</label>
    <select class="form-control">
      <option>Option one</option>
      <option>Option two</option>
    </select>
 </div>
 <div class="col-xs-3">
 <label>Country of birth</label>
  <select class="form-control">
      <option>Option one</option>
      <option>Option two</option>
    </select>
    </div>
  </div>
         <div class="form-group">
         
    <div class="container">
    <label>Birthday</label>
    <div class="dropdown">
      <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">Day <span class="caret"></span></button>
      <ul class="dropdown-menu">
        <li><a href="#">1</a></li>
        <li><a href="#">2</a></li>
        <li><a href="#">2</a></li>
      </ul>
        <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">Month <span class="caret"></span></button>
        <ul class="dropdown-menu">
          <li><a href="#">1</a></li>
          <li><a href="#">2</a></li>
          <li><a href="#">2</a></li>
        </ul>
      <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">Year <span class="caret"></span></button>
      <ul class="dropdown-menu">
        <li><a href="#">1</a></li>
        <li><a href="#">2</a></li>
        <li><a href="#">2</a></li>
      </ul>
    </div>
    </div>
    <div class="container">
 <label>Time</label>
    <div class="dropdown">
      <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">Hour <span class="caret"></span></button>
      <ul class="dropdown-menu">
        <li><a href="#">1</a></li>
        <li><a href="#">2</a></li>
        <li><a href="#">2</a></li>
      </ul>
        <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">Min <span class="caret"></span></button>
        <ul class="dropdown-menu">
          <li><a href="#">1</a></li>
          <li><a href="#">2</a></li>
          <li><a href="#">2</a></li>
        </ul>
        <div class="checkbox">
            <label>
               <input type="checkbox"> I am over 18 and have read....
            </label>
         </div>
     <button type="button" class="btn btn-success">Success</button>
    </div>
    </div>
  </div>
  
    </form>
  <hr>
                      
                      
                    
                    
                       <!--  next DIV is end FORM-->
                      </div>
Как видно - я форму запихнул в div class="container"

Пытался в CSS Добавить
Код CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
.center {
  position: absolute;
  left: 50%;
  top: 50%;
  
 
  /*Nope =(  */
 /* margin-left: -25%;  */
 /* margin-top: -25%;  */
 
 
 
 
transform: translate(-50%, -50%);
  
 
 /*  Not even necessary really.  */
  /* e.g. Height could be left out! */
 
  width: 40%;
  height: 50%;
}
и все это запихнуть в <div class="container"> над div class="container" --> ничего не вышло...

Спасибо что прочли, надеюсь не лень будет вам написать ответ..
Ответ: И так.

Перерыл кучу разных ресурсов и в итоге пришел к более менее оптимальному варианту.

Выкладываю для тех кто может так же столкнуться с такой проблемой весь код формы и css.

Код 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
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
 <div  class="container center_div">
 <form role="form" class="form-horizontal" >
<div class="container">
   <div class="row">
 
            <div class="form-group">
        
    <div class="col-sm-3"><label>&nbsp;</label>
      <input type="text" class="form-control" id="inputEmail3" placeholder="Name">
    </div>
     
    <div class="col-sm-3"><label>&nbsp;</label>
      <input type="text" class="form-control" id="inputEmail3" placeholder="Lastname">
    </div>
    </div>
   
      <div class="form-group">
       <div class="col-sm-3"><label>&nbsp;</label>
       <input type="Email" class="form-control" placeholder="Email">
       </div>
        <div class="col-sm-3"><label>&nbsp;</label>
        <input type="text" class="form-control" placeholder="Phone">
        </div>
        </div>
         <div class="form-group">
       <div class="col-sm-3"><label>&nbsp;</label>
       <input type="text" class="form-control" placeholder="Zipcode">
       </div>
        <div class="col-sm-3"><label>&nbsp;</label>
        <input type="text" class="form-control" placeholder="Address">
        </div>
        </div>
         <div class="form-group">
       <div class="col-sm-3"><label>&nbsp;</label>
       <input type="text" class="form-control" placeholder="City">
       </div>
        <div class="col-sm-3"><label>&nbsp;</label>
        <input type="text" class="form-control" placeholder="Birthplace">
        </div>
        </div>
 <div class="form-group">
 <div class="col-sm-3"><label>&nbsp;</label>
 <select class="form-control">
<option value='' disabled selected style='display:none;'>Gender</option>
 <option>1</option>
 <option>2</option>
 <option>3</option>
 
</select>
</div>
 <div class="col-sm-3"><label>&nbsp;</label>
 <select class="form-control">
<option value='' disabled selected style='display:none;'>Country of Birth</option>
 <option>1</option>
 <option>2</option>
 <option>3</option>
 
</select>
</div>
 </div>
 
    
    
 <!-- Time+Days -->
 <div class="form-group">
 
            
 
 <div class="col-md-1">
<select class="form-control input-sm mrgn-bttm-sd" id="form-select-sm">
<option value='' disabled selected style='display:none;'>Day</option>
 <option>1</option>
 <option>2</option>
 <option>3</option>
</select>
</div>
<div class="col-md-1">
<select name="form-select-sm" class="form-control input-sm mrgn-bttm-sd" id="form-select-sm2">
  <option value='' disabled selected style='display:none;'>Month</option>
  <option>1</option>
  <option>2</option>
  <option>3</option>
</select>
</div>
<div class="col-md-1">
<select name="form-select-sm2" class="form-control input-sm mrgn-bttm-sd" id="form-select-sm3">
  <option value='' disabled selected style='display:none;'>Year</option>
  <option>1</option>
  <option>2</option>
  <option>3</option>
</select>
</div>
 
 
 
           
 <div class="col-md-2">
<select class="form-control input-sm mrgn-bttm-md" id="form-select-sm234">
<option value='' disabled selected style='display:none;'>Hour</option>
 <option>1</option>
 <option>2</option>
 <option>3</option>
</select>
</div>
 
<div class="col-md-1">
<select class="form-control input-sm mrgn-bttm-md" id="form-select-sm44">
  <option value='' disabled selected style='display:none;'>Min</option>
  <option>1</option>
  <option>2</option>
  <option>3</option>
</select>
</div>
 
 
 
  </div><!-- end Time+Days -->
  
  
   <div class="form-group"><!-- Start for Checkbox and button -->
   
  <!--<div class="form-group has-success">
        <label></label>
        <input id="check-1h" type="checkbox" value="1" data-toggle="checkbox-x" data-size="xl">
    </div>
     -->
 
        
   <div class="col-md-2">
    
   <input type="checkbox" class="largerCheckbox" name="checkBox">
  
  <label>I am over 18 and have read and approved the site's Terms Order with oblifation to pay</label>
   
   
   </div>
 
<div class="col-sm-4">
    <a href="#" class="btn btn-block btn-lg btn-success">OK</a>
    </div>
    
    
  </div><!-- end for Checkbox and button -->
 
  
</div> <!-- Container -->
  </div>  <!-- Row -->
     
  </form>
 
</div>
Хочется обратить внимание что весь этот див сидит у меня в секции. На всякий...

А вот решение в CSS

Код 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
.center_div{
   width:600px;
    margin:0px auto;
    text-align:left;
    padding:15px;
    } /* value of your choice which suits your alignment */
}
 
/*
form {
    
   width: 100%;
    margin: 0 auto;
 */
}
 
.container1 {float:left; width:100%; margin-right:-100px;}
.container2 {margin-right:110px;}
.center-col {margin-left:100px; }
 
input.largerCheckbox
{
    width: 30px;
    height: 30px;
}

Проблема решена.


Но оставлю еще вопрос, может кто то быстрее меня его решит и поделится - при просмотре на разных мониторах - разрешение динамически меняется. Но бывает глюк что <div class="col-md-2"> просто растягивается во всю ширь. Кто то знает как можно заменить <div class="col-md-2"> на что то аналагичное, но что бы растягивался хорошо ?)
Вопрос: Отследить всех, кто не заполнил форму

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

P.S. Сам я не программист, а сеошник.
Ответ: Ясно, спасибо за разъяснения)

А если делать с куками, то во сколько это примерно обойдется?
Вопрос: Заполнение форм, подтверждение и последующая обработка полученной страницы

Возможно ли как то заполнить формы на определённом сайте, принять введенные данные (т.е. сымитировать событие нажатия на кнопку). После чего перейти на следующую страницу и получить данные (соответствующие введенным в поля, конечно же)?
Пример: В поле поиска на книжном сайте вводиться название книги, после чего имитируется нажатие Enter и результаты поиска обрабатываются.

Вопрос не стоит в обработке данных. Вопрос касается возможности сымитировать действия пользователя с целью получить данные соответствующие запросу.
Ответ: с помощью javascript'a через объект XMLHTTPRequest можно получить код какой-нибудь HTML-страницы, но только всей страницы целиком, как она есть
Ну а далее можете, если сумеете, распарсить этот код и "вытащить" из него нужную вам информацию
что-нибудь на чужой странице программно заполнить, чтобы получить нужные данные -- НЕЛЬЗЯ, НЕ ПОЛУЧИТСЯ
теперь, наконец-то, вам всё окончательно понятно или опять есть вопросы?
кстати, перенести вашу тему куда-то -- это не в моей компетенции (мизантроп и модератор -- это "две большие разницы")
Вопрос: Приоритет отправки форм ajax

Здравствуйте, добрые люди!

Такая проблема: есть готовый рабочий скрипт отправки данных на мыло с помощью ajax... он работает стабильно хорошо для всех форм на сайте.

Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
$("form").submit(function(e) { //Change
            var th = $(this);
            $.ajax({
            type: "POST",
            url: "/mail.php", //Change
            data: th.serialize()
        }).done(function() {
            $('#popup').show();
        }).error(function(){
                     $('#popup-error-something').show();
        });
        
        return false;
    });
Но мне понадобилось создать отдельную форму, чтобы приходили данные на иную почту. Форме присвоил id="calc_form" и создал отдельный обработчик данных mail-calc.php

Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
$("#calc_form").submit(function(e) { //Change
            var th = $(this);
            $.ajax({
            type: "POST",
            url: "/mail-calc.php", //Change
            data: th.serialize()
        }).done(function() {
            $('#popup').show();
        }).error(function(){
                     $('#popup-error-something').show();
        });
        
        return false;
    });
Всё дело в том, что при отправке заполненной формы всё время обрабатывается через первый общий обработчик.
С присвоенный id игнорируется. Как можно исправить ситуацию?

Спасибо всем за ответы!!!
Ответ: Уф, Спасибо за такой быстрый ответ.
Но на данный момент приходит сразу на 2 почты. А надо чтобы форма #calc_form приходила только на почту в /mail-calc.php

Добавлено через 47 минут
Уф, СПАСИБО! Это я сам напутал немного.
Всё работает!
Вопрос: Пропадает форма после ajaxSucces

Добрый день товарищи программисты! Помогите разобраться с проблемой. Есть форма обратной связи, используется модальное окно fancybox, она через jquery ajax() отправляет данные на файл со скриптом. Все хорошо, данные отправляются, приходит ответ и выполняется то, что указано в свойстве jQuery.ajax succes. Но при этом также сама форма стает display: none. Как можно это предотвратить? Нужно сначала обработать ответ вывести сообщение, а потом пользователь исправляет данные, нажимает отправить и если все хорошо, форма стает display: none. Подскажите как то можно предотвратить скрытие формы несмотря на то, что пришел succes, но результат succes не тот, что нужен, а форма скрывается?

Блок с формой
<div id="feedback">
    <h2 class="feedback_header">Заказать <br/>обратный звонок</h2>
    <form id="f_contact" name="contact" action="#" method="post">
        <label for="f_name">Ваше имя:</label><br>
        <input type="text" id="f_name" class="f_input" name="f_name"><br>
        <label for="f_phone">Ваш телефон:</label><br>
        <input type="text" id="f_phone" class="f_input" name="f_phone"><br>
        <button id="f_send">Заказать звонок</button>
    </form>
<p style="text-align: center;"><strong class="f_msg"></strong></p>
</div>


Код jquery ajax
$(document).ready(function(){
    $(".modalbox").fancybox();
    $("#f_contact").submit(function(){ return false; });
    $("#f_send").on("click", function(){
if($("#f_name").val()!='empty' && $("#f_phone").val()!='empty')
        {
            jQuery.ajax({   
                url: "/ajax/form.php",
                type: "POST", 
                dataType: "json",
                data: "f_name="+$("#f_name").val()+"&f_phone="+$("#f_phone").val(),
                success: function(response) {
                    setTimeout("$(\".f_msg\").text(\"Запрос отправлен!\")", 600);
                    $("#f_contact").fadeOut("fast", function(){
                        setTimeout("$.fancybox.close()", 2500);
                    });
                    
                },
                error: function(req, text, error) { 
                    console.log(req);
                    console.log(text);
                    console.log(error);
                    $(".f_msg").text("Запрос не отправлен!");
                }
            });    
            
        } else {
            $(".f_msg").text("Заполните все поля!");    
        }
});
});
Ответ: это все из-за неопытности, костыли, грабли, мультики, ты прав laimas таймер здесь лишний, спасибо за помощь!
Вопрос: Валидация формы через element.getAttribute

Здравствуйте, сделал валидацию формы через. ( element.getAttribute ).
 
скрипт:

Код:
 
function checkForm(obj, elems) {  
 var element, pattern;  
 for (var i = 0; i < obj.elements.length; i++) {// пробегаемся по всем элементам формы  
 element = obj.elements[i];  
 // Проверяем только нужные поля  
 if (elems != undefined)  
 if (elems.join().indexOf(element.type) < 0) continue;  
 // И только если есть чего говорить юзеру в случае ошибки  
 if (!element.getAttribute("check_message")) continue;  
 if (pattern = element.getAttribute("check_pattern")) { // если задан рег  
 pattern = new RegExp(pattern, "g");  
 if (!pattern.test(element.value)) {  
 alert(element.getAttribute("check_message"));  
 element.focus();  
 return false;  
 }  
 } else if(/^\s*$/.test(element.value)) {// иначе просто проверка что поле не пустое  
 alert(element.getAttribute("check_message"));  
 element.focus();  
 return false;  
 }  
 }  
 return true;  
 }  
 </script>
 

 
На данный момент если срабатывает валидация, всплывает окно брайзера стандартное и пишет что такое то поле не заполнено.
 
Подскажите как реализовать вывод сообщения в div,  хочу убрать всплывающие окно. брайзер ругается бывает и просит поставить галочку на закрытие данного окна.
 
Так же как реализовать что бы к диву перекидывало после срабатывания валидации.
Ответ: Доработал свойства js, а то не совсем хорошо было, если ошибка то кидало на див на текст ошибки валидации, так же если все ок, нет ошибок то кидало на верх, я вставил так.
 
document.getElementById('validationka').style.display = "block"
document.getElementById('validationka').innerHTML = element.getAttribute("check_message");    
window.scrollTo(500, 0);
 
теперь работает так, если есть ошибка то кидает на верх к валидации, если нет ошибки то не кидает.
Вопрос: Модальное окно формы с затемнением заднего фона

Доброго времени суток всем!
Возникла такая проблема. Создаю форму авторизации в виде модального окна. Хочу сделать так, чтобы когда появлялась форма, то остальной фон затемнялся. Для затемнения использую div-блок с position: fixed; c прозрачностью, меньшей единицы и z-index'ом равным 100. У самого модального окна я поставил z-index: 200, надеясь, что он унаследуется всеми вложенными div-ами, из которых я собирал модальное окно и все они будут лежать "выше" затемнения, значит не будут "затемняться". Но это не помогло. Часть составных блоков формы затемнилась, часть - осталось светлыми.

Скриншоты проблемы:
del-- форма без затемнения
del -- форма с затемнением(затемнение "залазит" один из внутренних блоков формы, что смотрится некрасиво.

Код верстки:
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<body>
  <center><button onclick="show('block');">Авторизироваться</button></center>
  
  <!-- Блок для затемнения -->
  <div id="TB_overlay"></div>
  
  <!-- Блок для формы -->
  <div id="div_form">
    <div id="div_header">Авторизация</div>
    <div id="div_body"> </div>
    <div id="content">
       <table>
       <tr><td class = "cl1">Логин:</td> <td><input type="text" size="25" /></td></tr>
       <tr><td class = "cl1">Почта:</td> <td><input type="text" size="25" /></td></tr>
       <tr><td class = "cl1">Пароль:</td> <td><input type="text" size="25" /></td></tr>
       <tr><td class = "cl1">Пароль(повторно):</td> <td><input type="text" size="25" /></td></tr>
       </table>   
       <a href="#" class="button_Ok">Ок</a>
       <a href="#" class="button_Ok">Отмена</a>
    </div>
  </div>
 
</body>
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
/*Для полей ввода данных*/
input[type=text], input[type=password], textarea { 
 border: 1px solid #777;
}
input {
 vertical-align: middle;
}
input[type=password]:hover, input[type=text]:hover{ 
 background: #ffffe1; 
 border: 1px dashed #555;
}
input[type=password]:focus, input[type=text]:focus, textarea:focus { 
 background: #f8f8f8; 
 border: 1px solid #999;
}
 
 
/*Для таблицы форматирования*/
table {
border-collapse: collapse; 
border-width: 0px;
z-index: 200;
}
 
td {border: 0px solid grey; align: rigth;z-index: 100;}
 
.cl1{text-align: right;z-index: 200;}
 
/*Для затемнения всего, кроме формы*/
#TB_overlay {
    display: none; 
    //opacity: 0.8; 
    position: fixed; 
    left: 0; 
    right: 0; 
    top: 0; 
    bottom: 0; 
    padding: 16px; 
    background-color: rgba(1, 1, 1, 0.8); 
    z-index: 100; 
    overflow: auto; 
}
 
/*Для создания формов блоков*/
#div_form {
display: none;
border-radius: 10px 10px 10px 10px;
margin: auto;
margin-top: auto;
width: 400px;
height: 232px;
position: fixed;
top: 50%;
left: 50%;
 margin-top: -110px;
 margin-left: -200px;
 box-shadow: 0 0 15px 3px #000;
 z-index: 200;
}
 
#div_header {
  //border: 1px solid black;
  height: 20px;
  border-radius: 10px 10px 0px 0px;
  background: linear-gradient(to top, #aaa, #fff);
  padding: 5px;
  text-align: center;
  z-index: 200;
}
 
#div_body {
  border: 1px solid black;
  height: 200px;
  border-radius: 0px 0px 10px 10px;
  background: #000; 
  opacity: 0.5;
  z-index: 200;
}
 
#content{
  position: relative;
  top: -190px;
  left: 10px; 
  z-index: 200;
}
 
/*Для кнопок*/
a.button_Ok {
  position: relative;
  display: inline-block;
  font-size: 90%;
  font-weight: 700;
  color: rgb(209,209,217);
  margin-top: 20px;
  margin-left: 70px;
  text-decoration: none;
  text-shadow: 0 -1px 2px rgba(0,0,0,.2);
  padding: .5em 1em;
  outline: none;
  border-radius: 3px;
  background: linear-gradient(rgb(110,112,120), rgb(81,81,86)) rgb(110,112,120);
  box-shadow:
   0 1px rgba(255,255,255,.2) inset,
   0 3px 5px rgba(0,1,6,.5),
   0 0 1px 1px rgba(0,1,6,.2);
  transition: .2s ease-in-out;
}
a.button_Ok:hover:not(:active) {
  background: linear-gradient(rgb(126,126,134), rgb(70,71,76)) rgb(126,126,134);
}
a.button_Ok:active {
  top: 1px;
  background: linear-gradient(rgb(76,77,82), rgb(56,57,62)) rgb(76,77,82);
  box-shadow:
   0 0 1px rgba(0,0,0,.5) inset,
   0 2px 3px rgba(0,0,0,.5) inset,
   0 1px 1px rgba(255,255,255,.1);
}
Javascript
1
2
3
4
function show(state){ 
    document.getElementById('div_form').style.display = state;             
    document.getElementById('TB_overlay').style.display = state;              
} 


Будьте добры, подскажите пожалуйста в чём мои ошибки, наставьте на путь истинный!

CSS-код блоков, из которых состоит форма-окно:
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
/*Для создания формов блоков*/
#div_form {
display: none;
border-radius: 10px 10px 10px 10px;
margin: auto;
margin-top: auto;
width: 400px;
height: 232px;
position: fixed;
top: 50%;
left: 50%;
 margin-top: -110px;
 margin-left: -200px;
 box-shadow: 0 0 15px 3px #000;
 z-index: 200;
}
 
#div_header {
  //border: 1px solid black;
  height: 20px;
  border-radius: 10px 10px 0px 0px;
  background: linear-gradient(to top, #aaa, #fff);
  padding: 5px;
  text-align: center;
  z-index: 200;
}
 
#div_body {
  border: 1px solid black;
  height: 200px;
  border-radius: 0px 0px 10px 10px;
  background: #000; 
  opacity: 0.5;
  z-index: 200;
}
 
#content{
  position: relative;
  top: -190px;
  left: 10px; 
  z-index: 200;
}
CSS-код блока затемнения:
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
#TB_overlay {
    display: none; 
    //opacity: 0.8; 
    position: fixed; 
    left: 0; 
    right: 0; 
    top: 0; 
    bottom: 0; 
    padding: 16px; 
    background-color: rgba(1, 1, 1, 0.8); 
    z-index: 100; 
    overflow: auto; 
}
Ответ: Cпасибо Вам огромное за развернутый ответ и подробные замечания!
Прикрепил ваш исправленный код стилей и всё заработало так, как хотелось изначально)
Буду разбираться в тонкостях. Еще раз спасибо Вам!!!