Есть список групп, в них есть пользователи. Необходимо, что бы при клике на группу, отправлялся get запрос на сервер и из полученных данных формировался дочерний список.
var Metka = false;
function GetUsersGroup(IdGroup) {
if (Metka == true ) {
console.log(Metka)
return;
}
Metka = true;
var lis = $("li[id='One']");
var index;
var status = false;
for (var i = 0; i < lis.length; i++) {
if (lis[i].innerHTML == " - "+IdGroup) {
lis[i].innerHTML = " + "+IdGroup;
index = i;
} else if (lis[i].innerHTML == " + "+IdGroup){
lis[i].innerHTML = " - "+IdGroup;
status = true;
var lol = document.getElementById(IdGroup);
lol.remove();
Metka = false;
return;
}
}
$.ajax({
type: "GET",
url: "/index/Group/"+IdGroup,
success: function(res) {
var ul = document.createElement('ul');
ul.setAttribute("class","Two_spisok")
ul.setAttribute("id",IdGroup)
for (var key in res) {
for (var key2 in res[key]) {
//console.log(res[key][key2])
var li = document.createElement('li');
li.innerHTML = res[key][key2].Family + " " + res[key][key2].Name + " " + res[key][key2].Patronymic;
ul.appendChild(li);
}
}
var ulList = document.getElementById('spisok');
for (var i = 0; i < ulList.children.length; i++ ) {
//console.log("i::->",ulList.children[i].innerHTML);
if (ulList.children[i].innerHTML == " + "+IdGroup) {
index = i;
}
}
console.log("ulList::",ulList,"index",index+1);
ulList.insertBefore(ul, ulList.children[index+1]);
}
});
Metka = false;
}
Html страница тут формируется список групп, на языке golang (но суть не в этом):
<ul id="spisok">
{{ range $group := .Groups }}
<li OnClick="GetUsersGroup({{$group}})" id="One"> - {{$group}}</li>
{{end}}
</ul>
А в том, что вызов функции похоже асинхронный и если ее вызвать повторно пока она выполняется сбиваются индексы, сделал метку, что бы это можно было пронаблюдать. Дак вот как сделать его синхронным, или как то подправить код?