Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 05.01.2009, 11:26
Новичок на форуме
Отправить личное сообщение для Deexus Посмотреть профиль Найти все сообщения от Deexus
 
Регистрация: 05.01.2009
Сообщений: 3

Проблема со списком jquery
Помогите пожалуйста. Суть проблемы в следующем.
Есть список, выполненный в виде строк таблицы <tr>. Внутри находится несколько колонок. В одной из колонок ссылка для удаления родительского <tr> (.delete). В другой выводится номер строки, совпадающий с id родительского <tr> (.number). На странице также есть ссылка для добавления строк, т.е. элементов списка (.add). Так вот, допустим мы добавляем n элементов списка. У каждого элемента <tr> свой id, по возрастанию. При удалении одного из элементов, должен производиться пересчет, т.е. если у нас есть 3 элемента и мы удаляем второй, то 2 удаляется, а 3 меняет свой id на 2. Я реализовал это след. образом. При нажатии на удалить, id засовываю в переменную. После етого произвожу удаление всего, что было после <tr> то есть все next tr'ы, и воссоздаю их снова с помощью цикла. Работает, но некорректно. В FF и Oper'e все работает нормально, но если попытаться удалить элемент с id=2, два раза, т.е. до удаления и после, то ничего не происходит. Если после этого добавить элемент, то все нормально, но опять же нельзя удалить два раза. В IE при нажатии на удалить, удаляет, если элемент только один. Если несколько, то удаляет только при нажатии на "удалить" последнего элемента, а потом первого.
Код прилагается ниже. Помогите разобраться с данным методом или если есть метод проще, подскажите пожалуйста
Заранее спасибо.

$(document).ready(function(){
		$(".add").click(function() {
			a=a+1;
			arr[a]=a;
			p=a;
			var oldHtml = $('#approachs-list tr:last').html();
			if (a%2 == 0) {
	var newHtml = '<tr id=' + arr[a] + ' class="blue">' + oldHtml +'</tr>';
			}
			if (a%2 != 0) {
	var newHtml = '<tr id=' + arr[a] + ' class="pink">' + oldHtml +'</tr>';
			}
		$('#approachs-list').append(newHtml);
		$('#approachs-list tr:last .number').text(arr[a]);
		$('.delete').click(function() {
			tr = $(this).parents('tr');
			thisid = $(tr).attr('id');
			$(tr).nextAll()
				.remove();
			tr.remove();
			j = arr[thisid];
			for (i=j;i<p;i++) {
		        var oldHtml2 = $('#approachs-list tr:first').html();
			if (i%2 == 0) {
		var newHtml2 = '<tr id=' + i + ' class="blue">' + oldHtml2 +'</tr>';
			}
			if (i%2 != 0) {
		var newHtml2 = '<tr id=' + i + ' class="pink">' + oldHtml2 +'</tr>';
			}
			$('#approachs-list').append(newHtml2);
			$('#approachs-list tr:last .number').text(i);
			}
			p=p-1;
			a=a-1;
		});
	});
});
Ответить с цитированием
  #2 (permalink)  
Старый 05.01.2009, 12:11
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 10.07.2008
Сообщений: 3,873

Это бредовая идея с пересчетом идентификаторов, пересмотрите алгоритм решения задачи.
Помоему у каждой строки в таблице есть свойство rowIndex, которое пересчитывается браузером автоматически при добавлении/удалении строк.
Ответить с цитированием
  #3 (permalink)  
Старый 09.01.2009, 20:35
Новичок на форуме
Отправить личное сообщение для Deexus Посмотреть профиль Найти все сообщения от Deexus
 
Регистрация: 05.01.2009
Сообщений: 3

Код поправил, проблемы частично устранил Вот только click в IE на динамически созданных элементах не работает (точнее работает, но только на одном элементе). В других браузерах все ок. Использую библиотеку livequery для обработки динамически созданных элементов.

В чем может быть проблема?
Ответить с цитированием
  #4 (permalink)  
Старый 09.01.2009, 21:33
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 10.07.2008
Сообщений: 3,873

В jQuery 1.3 (обещают финальную версию через несколько дней) будет встроен метод live, который делает тоже самое, что плагин livequery.

В вашем случае вообще лучше повесить один обработчик события на таблицу и использовать эффект всплывания события:
$('table').bind('click', function(e) {
     if(e.target.tagName == 'TR') {
         // e.target.rowIndex — номер строки
     }
});

Тогда не нужно будет отслеживать изменения DOM и назначать нужные обработчики событий.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
jQuery для загрузки страницы в <div> Dr.Holerik jQuery 12 11.10.2016 18:36
первый опыт jquery. Вопросы. Titto jQuery 0 17.09.2008 10:32
проблема с обработкой DIV nerik AJAX и COMET 2 22.08.2008 17:40
Проблема с маркером kostian02 Общие вопросы Javascript 0 23.06.2008 16:10
проблема с передачей русского текста в Prototype subaru Prototype & script.aculo.us 2 26.07.2007 16:56