The action itself is performed, and the div does not change in the form code. I read all the topics and could not make it work properly.
< script > $(document).ready(function() { $('#btn').click(function() { // собираем данные с формы var clientName = $('#clientName').val(); var clientPhone = $('#clientPhone').val(); var clientAuto = $('#vehicle_make').val(); var clientComment = $('#clientComment').val(); // отправляем данные $.ajax({ url: "post.php", // куда отправляем type: "post", // метод передачи dataType: "json", // тип передачи данных data: { // что отправляем "name": clientName, "phone": clientPhone, "vehicle_make": clientAuto, "message": clientComment }, // после получения ответа сервера success: function(i, response) { $('.messages').html(response.result); // выводим ответ сервера }, error: function() { alert('Not OKay'); } }); return false; }); }); < /script> Here is the form
<form id="contact_form" action="" method="post" class="vc_row wpb_row vc_row-fluid padding-bottom-66 page-margin-top cost-calculator-container contact-form"> <div class="wpb_column vc_column_container vc_col-sm-12"> <div class="wpb_wrapper"> <div class="vc_row wpb_row vc_inner vc_row-fluid"> <div class="wpb_column vc_column_container vc_col-sm-4"> <div class="vc_column-inner "> <div class="wpb_wrapper"> <div class="cost-calculator-box clearfix"> </div> </div> </div> </div> </div> <div class="vc_row wpb_row vc_inner vc_row-fluid page-margin-top"> <div class="wpb_column vc_column_container vc_col-sm-6"> <div class="vc_column-inner "> <div class="wpb_wrapper"> <div class="cost-calculator-box cost-calculator-contact clearfix"> <div class="vc_row wpb_row vc_inner"> <label>Контактные данные</label> <div class="messages">.</div> </div> <div class="vc_row wpb_row vc_inner margin-top-20"> <div class="block"> <input class="text_input" name="name" id="clientName" type="text" placeholder="Ваше имя"> </div> <div class="block"> <input class="text_input" name="phone" id="clientPhone" type="tel" placeholder="Ваш номер"> </div> <div class="block"> <select name="vehicle_make" id="vehicle_make" class="cost-dropdown"> <option value="" selected="selected">Выберите марку...</option> <option value="General Motors">General Motors</option> <option value="Land Rover">Land Rover</option> <option value="Lexus">Lexus</option> <option value="Lincoln">Lincoln</option> <option value="Mazda">Mazda</option> <option value="Mercedes - Benz">Mercedes - Benz</option></select> </div> <div class="block"> <textarea class="margin-top-20" name="message" id="clientComment" placeholder="Additional Questions or Comments"></textarea> </div> </div> <div class="vc_row wpb_row vc_inner margin-top-20"> <button id="btn" class="more display-block submit-contact-form" title="Заказать обратный звонок"><span>Заказать обратный звонок</span></button> </div> </div> </div> </div> </div> </div> </div> </div> </form> post.php
$msg_box = ""; // в этой переменной будем хранить сообщения формы $errors = array(); // контейнер для ошибок // проверяем корректность полей if($_POST['name'] == "") $errors[] = "Поле 'Ваше имя' не заполнено!"; if($_POST['phone'] == "") $errors[] = "Поле 'Ваш e-mail' не заполнено!"; if($_POST['vehicle_make'] == ""){ $clientCar="Не указана";} else { $clientCar = $_POST['vehicle_make'];} // if($_POST['message'] == ""){ $clientMessage="-";} else { $clientMessage = $_POST['message'];} // если форма без ошибок if(empty($errors)){ // собираем данные из формы date_default_timezone_set('europe/moscow'); $message = "Дата заявки: " . date("mdy G:i") . "\n" . "Имя: " . $_POST['name'] . "\n" . "Номер: " . $_POST['phone'] . "\n" . "Марка: " . $clientCar . "\n" . "Комментарий: " . $_POST['message'] . "\n" ; sendMessage($chat_id, $message); // выведем сообщение об успехе $msg_box = "<span style='color: green;'>ПУШКА</span><br/>"; }else{ // если были ошибки, то выводим их $msg_box = ""; foreach($errors as $one_error){ $msg_box .= "<span style='color: red;'>$one_error</span><br/>"; } } // делаем ответ на клиентскую часть в формате JSON echo json_encode(array( 'result' => $msg_box )); function sendMessage($chat_id, $message) { file_get_contents($GLOBALS['api'] . '/sendMessage?chat_id=' . $chat_id . '&text=' . urlencode($message)); } function is_empty(&$var) { return !($var || (is_scalar($var) && strlen($var))); }