Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 18.12.2016, 23:01
Интересующийся
Отправить личное сообщение для ОмаЭль Посмотреть профиль Найти все сообщения от ОмаЭль
 
Регистрация: 11.10.2014
Сообщений: 18

Динамическое создание меню
Есть список групп, в них есть пользователи. Необходимо, что бы при клике на группу, отправлялся 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>


А в том, что вызов функции похоже асинхронный и если ее вызвать повторно пока она выполняется сбиваются индексы, сделал метку, что бы это можно было пронаблюдать. Дак вот как сделать его синхронным, или как то подправить код?
Ответить с цитированием
  #2 (permalink)  
Старый 18.12.2016, 23:30
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 458

ОмаЭль,
$.ajax({
	type: "GET",
	url: "/index/Group/" + IdGroup,
	success: function(res) {
		// ...
	},
	complete: function() {
		Metka = false;
	}
});
Ответить с цитированием
  #3 (permalink)  
Старый 19.12.2016, 20:57
Интересующийся
Отправить личное сообщение для ОмаЭль Посмотреть профиль Найти все сообщения от ОмаЭль
 
Регистрация: 11.10.2014
Сообщений: 18

Rise,
Благодарю
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Замена стилей класса Павел Турченко Элементы интерфейса 9 30.10.2015 15:24
Бесконечноуровневое меню на CSS ruslan_mart Ваши сайты и скрипты 5 12.01.2015 20:59
Оптимизация кода (создание горизонтального меню) IONEX jQuery 0 16.01.2012 05:07
Проблема с аккордионом и меню Tie ExtJS 3 01.09.2011 14:36
динамическое меню с градиентом Angel_33_3 Общие вопросы Javascript 0 06.10.2010 12:50