Есть несколько форм на которые можно ответить Одобрен/Отклонён. После нажатия на Одобрен/Отклонён вызывается AJAX. Хотелось бы чтобы при удачном вызове AJAX к span добавлялось +1, +2 и тд. Как это правильнее сделать?
js:
$( document ).ready(function() {
var formaElement = $(".container");
var counter = 0;
formaElement.find("form[id*='zaya']").each(function() {
var stringsp = 'zaya';
var element = document.querySelectorAll("form[id*='zaya']")[counter];
var idElement = element.id;
var need = idElement.split(stringsp);
var need = need[1];
$("#odoZaSe"+need).click(function(ev){
ev.preventDefault();
var newDivOtk = document.getElementById("creaDivOtk"+need);
newDivOtk.remove();
var odob = "True";
sendAjaxForm('result_form', 'zaya'+need, 'zayavki.php', odob);
var forRemo = "zaya"+need";
removeForm(forRemo);//Удаляем отправленную форму
return false;
});
counter++;
});
});
function otkZa(idza, coun){
var desc = document.createElement("div");
desc.className = "form-group";
desc.id = "creaDivOtk"+coun;
desc.innerHTML = "<label>Причина отказа:</label>"+
"<input name=\"desc\" type=\"text\" class=\"form-control\" placeholder=\"Причина\">"+
"<input class=\"btn btn-primary\" type=\"text\" name = \"otkZaSe"+idza+"\" id=\"otkZaSe"+coun+"\" readonly value=\"Отклонить\">";
var placeDiv = document.getElementById("otkZa"+coun);
var parent = placeDiv.parentNode;
parent.insertBefore(desc, placeDiv);
placeDiv.remove();
var rem = document.getElementById("odoZaSe"+coun);
rem.remove();
var forRemo = document.getElementById("id ='zaya"+coun+"']");
$("#otkZaSe"+coun).click(function(ev){
ev.preventDefault();
var odob = "False";
sendAjaxForm('result_form', 'zaya'+coun, 'zayavki.php', odob);
removeForm(forRemo);//Удаляем отправленную форму
return false;
});
}
function sendAjaxForm(result_form, reg_form, url, odob) {
$.ajax({
url: url,
type: "POST",
dataType: "html", //формат данных
data: $("#"+reg_form).serialize(),
success: function(response) {
result = $.parseJSON(response);
if(result.good == "True"){
var message = document.getElementById('result_form');
message.innerHTML += "<p style='color: red;'>Операция произведена</p>";
message.scrollIntoView();
if(odob == "True"){
var span = document.getElementById('prinato');
var text = document.getElementById('prinato').textContent;
span.innerHTML = text+"<p style='color: red;'>+ "+number+"</p>";
//Вот здесь должно добавляться +1, +2 и тд.
}else if (odob == "False") {
var span = document.getElementById('nePrinato');
var text = document.getElementById('nePrinato').textContent;
span.innerHTML = text+"<p style='color: red;'>+ "+number+"</p>";
//Вот здесь должно добавляться +1, +2 и тд.
}
}
},
error: function(response) {
$('#result_form').html('Ошибка. Данные не отправлены.');
}
});
}
html $counterZaya - Просто счётчик, $idZaya - id заявки:
<p>
<!--Тут из БД берётся кол-во заявок до запросов-->
Принятые заявки: <span id = 'prinato' class = ''>$countPrin</span>
Не принятые заявки: <span id = 'nePrinato' class = ''>$countNePrin</span>
</p>
<div id="result_form"></div>
<div class="container">
<!--Тут в цикле выводятся формы-->
<form id=\"zaya$counterZaya\" class=\"buttons\">
<input name="odoZaSe$idZaya" id = "odoZaSe$counterZaya" type="text" class="btn btn-primary" value="Одобрить" readonly>
<button onclick="otkZa($idZaya, $counterZaya);" id="otkZa$counterZaya">Отклонить</button>
</form>
</div>