Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 22.08.2012, 15:38
wUI wUI вне форума
Аспирант
Отправить личное сообщение для wUI Посмотреть профиль Найти все сообщения от wUI
 
Регистрация: 19.04.2012
Сообщений: 78

appendTo в JQuery
Всем доброго времени суток

Имеется нумерованый список ul:
<ul id="main">
                <img onclick="getTreeMain('main');" class="imgTree" src="./resources/image/03.png" /> Тык ми!
            </ul>

При нажатии на картинку выполняется следующий код:
function getTreeMain(w) 
            {
                $.ajax({
                    type: 'POST',
                    data: "object="+w,
                    async: true,
                    url: './engine/modules/getData/getTree.php',
                    dataType: 'Json',
                    success: openTreeObj
                });
            }
function openTreeCdng(data)
            {
                for (var i = 0; i < data.length; i++) 
                {
                    $("<ul><img id= \"oid_"+data[i].objId+"\" onclick = \"getTreeObj("+data[i].objId+");\" class=\"imgTree\" src=\"./resources/image/04.png\" />"+data[i].objCapt+" "+data[i].objName+"</ul>").appendTo("#main");
                }
            }


Все отрабатывает и к элементу ul "main" достраиваются дочерние объекты нумерованного списка. В каждом из которых так же имеется изображение с индивидуальным ID, при нажатие на которое дочка получает свои дочерние элементы. Код:
function getTreeObj(w) 
            {
                $.ajax({
                    type: 'POST',
                    data: "object="+w,
                    async: true,
                    url: './engine/modules/getData/getTree.php',
                    dataType: 'Json',
                    success: openTreeObj
                });
            }
function openTreeObj(data)
            {
                for (var i = 0; i < data.length; i++) 
                {   
                    $("<ul><img onclick = \"getTreeObj("+data[i].objId+");\" class=\"imgTree\" src=\"./resources/image/04.png\" />"+data[i].objCapt+" "+data[i].objName+"</ul>").appendTo("#oid_"+data[i].objId);
                }
            }

Но к дочкам объекта "main", элементы не добавляются.
Вижу что обращение к серверу есть, и json массив с данными возвращается, обращаюсь к правильно указанным id. Ощущение, что они рпосто не видятся.
Прощу помощи советом!=)
Ответить с цитированием
  #2 (permalink)  
Старый 22.08.2012, 16:15
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

wUI,А чо Вы хотите этим добица ?
Почему .appendTo - а не append ? http://jquery-docs.ru/Manipulation/appendTo/#selector

http://jquery-docs.ru/Manipulation/append/#content
Ответить с цитированием
  #3 (permalink)  
Старый 23.08.2012, 06:21
wUI wUI вне форума
Аспирант
Отправить личное сообщение для wUI Посмотреть профиль Найти все сообщения от wUI
 
Регистрация: 19.04.2012
Сообщений: 78

Deff,
наверное не понятно объяснил. Своего рода это дерово объектов. Изначально существует родитель "main", при нажатие на него получаю его подобъекты и они красиво отстраиваются, при нажатии на подобъект он должен получить от серва свои дочерние объекты и их остроить, но этого не происходит. О_о
Ответить с цитированием
  #4 (permalink)  
Старый 23.08.2012, 07:31
wUI wUI вне форума
Аспирант
Отправить личное сообщение для wUI Посмотреть профиль Найти все сообщения от wUI
 
Регистрация: 19.04.2012
Сообщений: 78

Пробовал следующие варианты:
1.
$("#oid_"+data[i].objId).append("<ul><img onclick = \"getTreeObj("+data[i].objId+");\" class=\"imgTree\" src=\"./resources/image/04.png\" />"+data[i].objCapt+" "+data[i].objName+"</ul>");


2.
document.getElementById('oid_'+data[i].objId).innerHTML+="<ul><img onclick = \"getTreeObj("+data[i].objId+");\" class=\"imgTree\" src=\"./resources/image/04.png\" />"+data[i].objCapt+" "+data[i].objName+"</ul>"


Оба не выходят О_о

И вот вопрос, почему динамически полученные дочерние объекты достраиваются к жестко прописанному объекту "main", а далее по иерархии нет, т.е. дочерний объект к себе не привязывает своих дочек?
Будно динамически отсроеные дочки родителя "main" не видятся.

Последний раз редактировалось wUI, 23.08.2012 в 07:40.
Ответить с цитированием
  #5 (permalink)  
Старый 23.08.2012, 08:01
wUI wUI вне форума
Аспирант
Отправить личное сообщение для wUI Посмотреть профиль Найти все сообщения от wUI
 
Регистрация: 19.04.2012
Сообщений: 78

Вот пример кода, чтобы понятней было, который можно запустить у себя:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>Тег UL</title>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  <style type="text/css">
  ul {
    list-style-type: none;
    margin-left: 10px;
    }
  li {
    list-style-type: none;
    margin-left: 10px;
    }
  img {
    cursor: pointer;
    }
  </style>
  <script type="text/javascript">
    function getTreeMain(w) {
        for (i = 0; i < w; i++) {
            $("#main").append("<ul><img id= \"oid_"+i+"\" onclick = \"getTreeObj("+i+");\" src=\"http://best-iconki.ru/downloads/PNG/32/forsite-0003-5.png\" />daughter_0_"+i+"</ul>");
        }
    }
    function getTreeObj(w) {
        for (i = 0; i < w; i++) {
            $("#oid_"+i).append("<ul><img id= \"oid2_"+i+"\" src=\"http://best-iconki.ru/downloads/PNG/32/forsite-0003-5.png\" />daughter_1_"+i+"</ul>");
        }
    }
  </script> 
 </head>
 <body>
  <ul id="main"><img onclick="getTreeMain(5);" src="http://best-iconki.ru/downloads/PNG/32/programms-0002-1.png"></br>
  </ul>

 </body>
</html>
Ответить с цитированием
  #6 (permalink)  
Старый 23.08.2012, 10:42
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

Сообщение от wUI
$("#oid_"+i).append
Эта фигня - некорректна - Вы пытаетесь вставить объект внутрь тега картинки
И второе - У Вас повторяются id - что - не Айс - селектор $("#oid_"+i).будет искать только первый и единственный такой id


Возможно устроит подобное.. :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>Тег UL</title>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  <style type="text/css">
  ul {
    list-style-type: none;
    margin-left: 10px;
    }
  li {
    list-style-type: none;
    margin-left: 10px;
    }
  img {
    cursor: pointer;
    }
  </style>



  <script type="text/javascript">

    function getTreeMain(w) {
        for (i = 0; i < w; i++) {
	 var obj = '<ul><img id="oid-0-'+i+'" onclick ="getTreeObj('+i+',this)"';
	     obj+= 'src="http://best-iconki.ru/downloads/PNG/32/forsite-0003-5.png" />';
	     obj+= 'daughter-0-'+i+'</ul>';//alert(obj)
            $("#main").append(obj); 
        }
    }


  var J=0; //Добавил для Уникальности id
    function getTreeObj(w,a) {//alert("A")
  J++;
        for (i = 0; i < w; i++) {
	 var obj = '<ul><img id="oid2-'+J+'-'+i+'"';
	     obj+= 'src=\"http://best-iconki.ru/downloads/PNG/32/forsite-0003-5.png"'
	     //obj+= 'onclick ="getTreeObj('+J+',this)"'; //можно раскомментить строку
	     obj+= ' />daughter-'+J+'-'+i+'</ul>';//alert(obj)
            $(a).after(obj);
        }
    }
  </script>





 </head>
 <body>
  <ul id="main"><img onclick="getTreeMain(5,this)" src="http://best-iconki.ru/downloads/PNG/32/programms-0002-1.png"></br>
  </ul>

 </body>
</html>

Последний раз редактировалось Deff, 23.08.2012 в 10:50.
Ответить с цитированием
  #7 (permalink)  
Старый 23.08.2012, 11:39
wUI wUI вне форума
Аспирант
Отправить личное сообщение для wUI Посмотреть профиль Найти все сообщения от wUI
 
Регистрация: 19.04.2012
Сообщений: 78

Deff,
Спасибо, Вы как всегда на высоте!=) Указать ошибку долбошарому и вправить руки криворукому!
Не понимаю как не заметил того, что пытался привязать элементы дочернии картинке!
В итоге оставлю вот так:
function getTreeMain(w) {
        for (i = 0; i < w; i++) {
            $("#main").append("<ul id= \"oid_"+i+"\"><img onclick = \"getTreeObj("+i+");\" src=\"http://best-iconki.ru/downloads/PNG/32/forsite-0003-5.png\" />daughter_0_"+i+"</ul>");
        }
    }
    function getTreeObj(w) {
        for (i = 0; i < w; i++) {
            $("#oid_"+w).append("<ul id= \"oid2_"+i+"\"><img src=\"http://best-iconki.ru/downloads/PNG/32/forsite-0003-5.png\" />daughter_1_"+i+"</ul>");            
        }
    }
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Динамически загружаемая jQuery и jQuery-функции в одном файле 67bytes Общие вопросы Javascript 6 06.03.2013 09:01
jquery is not defined - странный случай tarya jQuery 2 16.07.2012 14:27
2 разных модуля на jQuery - как подключить? finder jQuery 4 23.03.2012 22:29
JQuery AppendTo north83 jQuery 1 20.06.2011 22:23
JQuery + FireFox NOOB jQuery 4 02.11.2009 18:16