Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   как сохранить DOM объект, подлежащий изменению? (https://javascript.ru/forum/jquery/59454-kak-sokhranit-dom-obekt-podlezhashhijj-izmeneniyu.html)

Floyd 11.11.2015 20:22

как сохранить DOM объект, подлежащий изменению?
 
всем привет!
уверен, что подскажете правильное решение.
есть табличка. тыкнул на строку, нажал изменить, аякс прислал окошко (слоем поверх таблички, append к body). в окошке изменил поля, сабмит, аяксом послал в базу, получил в ответ (если без ошибок) новую табличку.

как правильно зацепить объект таблички, чтобы поместить в него обновление?
ведь при аппенде меняется DOM (если не путаю), просто this таблички держать в переменной не получится. сохранять в переменную id таблицы и потом $("#"+s_idTable).html(...) ?
хочется элегантного решения без этого jquery-поиска.
спасибо!

pnpquest 11.11.2015 21:32

Вообще, ничего "неэлегантного" в Вашем способе я не вижу. Но можете воспользоваться replaceChild
<html>
<head>

<meta charset="utf-8">

<style>


</style>

</head>
<body>

<div id="outer">
<div id="inner">foo</div>
</div>


<script>


var div = document.createElement("div")
div.innerHTML = "bar"
div.id = "inner"
outer.replaceChild(div, inner)




</script>
</body>
</html>

Floyd 12.11.2015 01:42

Цитата:

Сообщение от pnpquest
можете воспользоваться replaceChild

как заменить - не проблема. вопрос не в этом.

ksa 12.11.2015 08:42

Цитата:

Сообщение от Floyd
просто this таблички держать в переменной не получится. сохранять в переменную id таблицы

Если умеешь сохранять ИД - так же сохранишь и ссылку на таблицу... Разницы нет никакой. :)

Floyd 12.11.2015 15:29

окей, возможно, я слишком упростил вопрос.
на самом деле у меня не id, а классы. окошек может вылезти несколько, и таблиц может быть на странице несколько с одинаковым классом. но редактирую я конкретную. и при редакции хотелось бы сохранить ссылку именно на эту таблицу, чтобы потом ее не искать через $(".tableClass").html(...), а сразу o_savedTableObject.html(...).
вот как сохранить этот o_savedTableObject неизменным и равным $(this) при клике на строке таблицы?

ksa 12.11.2015 15:33

Floyd, ты тестовые примеры не делаешь принципиально? :D

ksa 12.11.2015 15:39

Цитата:

Сообщение от Floyd
чтобы потом ее не искать через $(".tableClass").html(...), а сразу o_savedTableObject.html(...).

Вот кагбэ иллюстрация...

<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<script src='http://code.jquery.com/jquery-latest.js'></script>
<!--
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
$(function(){
	$('li').click(function(){
		var obj=this;
		setTimeout(function(){
			alert(obj.innerHTML);
		},1000);
	});
})
</script>
</head>
<body>
<ul>
	<li>0</li>
	<li>1</li>
	<li>2</li>
	<li>3</li>
</ul>
</body>
</html>

Floyd 12.11.2015 18:30

да вот на пальцах пытаюсь объяснить... :)
ksa, вот пользуясь твоим примером. сейчас в obj находится ссылка на li.
вот представь, мы сейчас делаем $(document.body).append("<div>новое окно</div>").
а после этого alert(obj.innerHTML)
будет ли после аппенда в obj тот самый li?

рони 12.11.2015 18:52

Floyd,
что мешает при отправке запроса указать в какую таблицу вернуть ответ
Цитата:

Сообщение от Floyd
просто this таблички держать в переменной не получится.

получится
обычно так делают ...
var self = this;
$.ajax({
  url: 'ajax/test.html',
  success: function(data){
    self.append(data)   }
});

pnpquest 12.11.2015 22:13

Цитата:

Сообщение от рони
обычно так делают

ИЧСХ, обычно, безо всякой на то нужды

element .onclick = function(){
$.ajax({
  url: 'ajax/test.html',
  success: function(data){
    element.append(data)   }
});
}

то же самое


Часовой пояс GMT +3, время: 05:02.