Суть вопроса. Есть div, который формируется на основе ajax-запроса. Отправляется form с параметрами и на их основе получаю ответ - Форму с чекбоксами и кнопку "Сохранить"
index.php:
<div class="1">
<form id="get_tasks_form">
<input type="hidden" name="obname" value="Name1">
<input type="hidden" name="obid" value="333">
<div class="paddingBottom">
<input type="button" class="btn btn-default" id="btnObject333" value="Name1">
</div>
</form>
</div>
<div id="objectinfo">
<p>DIV куда выводится ajax</p>
</div>
ajax-кнопка:
$( document ).ready(function() {
$('#btnObject333').click(
function(){
sendAjaxForm('objectinfo', 'get_tasks_form', '/core/ajax/ajax_monitoring.php');
return false;
});
});
Функция sendAjaxForm-
function sendAjaxForm(result_form, ajax_form, url) {
jQuery.ajax({
url: url, //url страницы (action_ajax_form.php)
type: "POST", //метод отправки
dataType: "html", //формат данных
data: jQuery("#"+ajax_form).serialize(), // Сеарилизуем объект
beforeSend: funcBefore,
success: function(response) { //Данные отправлены успешно
result = jQuery.parseJSON(response);
document.getElementById(result_form).innerHTML = result;
},
error: function(response) { // Данные не отправлены
document.getElementById(result_form).innerHTML = "Ошибка. Данные не отправленны.";
}
});
На данный запрос мне Ajax-ом возвращается такая форма:
<form method="POST" id="savePform">
<div class="form-group">
<input type="checkbox" name="pz" id="task_pz" value="1" checked="">
<label class="bg-success" for="task_pz">Пояснительная Записка</label>
</div>
<div class="form-group">
<input type="checkbox" name="pl" id="task_pl" value="1" checked="">
<label class="bg-success" for="task_pl">Планы</label>
</div>
<div class="form-group">
<input type="checkbox" name="fs" id="task_fs" value="1">
<labelfor="task_fs">Фасады</labelfor="task_fs">
</div>
<div class="form-group">
<input type="checkbox" name="razrez" id="task_razrez" value="1" checked="">
<label class="bg-success" for="task_razrez">Разрезы</label>
</div>
<div class="form-group">
<input type="checkbox" name="boxnotuse" id="notuseid" class="notuse" value="1">
<label class="btn btn-danger btn-sm" for="notuseid">Том не нужен</label>
</div>
<input name="task_id" type="hidden" value="1817">
<input name="pos_num" type="hidden" value="3">
<input name="object_id" type="hidden" value="79">
<div class="form-group text-right">
<input type="submit" class="btn btn-success" id="btnsaveP" value="Сохранить">
</div>
</form>
Далее я в этом же ответе пишу обработчик для кнопки "Сохранить" по аналогии с первой кнопкой:-
$( document ).ready(function() {
$('#btnsaveP').click(
function(){
sendAjaxForm('objectinfo', 'savePform', '/core/ajax/ajax_save.php');
return false;
});
});
Ожидаю что <div class="objectinfo">
заменится ответом из ajax_save.php
, однако при нажатии просто перегружается страница index.php
Как правильно реализовать второй ajax запрос для сохранения изменений в чекбоксах?