Как доработать карусель?

Question

[Romantik1991]

interCaros = new Carousel("id div в который нужно вывести");
	interCaros.format = function(item) {
		if ( ( typeof item == "undefined") || ( !item ) ) return "";  
		tmps = "<div class='dojoxCarouselItem'><div class='goodsImgDiv' style='height:"+(this.itm_height-60)+"px;' onclick='window.location=\"/interior/"+item.interid+"\"' "+
			"title='можно перейти на страницу интерьера'>"+
			"<img src='/tn"+item.mainp+"' alt='' style='max-width:"+(this.itm_width-30)+"px;max-height:"+(this.itm_height-70)+"px;'/></div>"+
			"<br/><span>"+item.iname+"</span></div>";
		return tmps;
	} 
	interCaros.id = "interCaros";
	interCaros.itm_height = 150;
	interCaros.url = "/urlurl;
	interCaros.query = {a:"{aid:"+item_aid+"}"};
	interCaros.startup();

Вот так задается обычная карусель, но мне нужно, чтобы она подгружалась по клику в нужный блок, который открывается. Есть таблица, если кликнуть на строку, то строка выделяется, ищется соседний скрытый div, берется его id. Потом выводится эта карусель по этому id в нужный div. Дело в том, что таких divов и каруселей может быть много и они могут работать независимо друг от друга одновременно.
Я сделал это вот так.

$(function () {
	$('#confTable div.button').click(function() {
		$(this).toggleClass('selected');
		var checkElement = $(this).next();
		var queryId = checkElement.find('div').attr('id');
		if (typeof confCaros == "undefined")confCaros = new Array();
		confCaros[queryId] = new Carousel(queryId);
		confCaros[queryId].itm_height = 100;
		confCaros[queryId].itm_width = 70;
		confCaros[queryId].format = function(arg) { 
			if ( arg ) return "<div class='goodsItem'> "+"<img src='"+"/tn"+arg.mattex+"' class='gridImg' "+
			"alt='' title='"+arg.matgname+" ("+arg.matgcode+")\n"+arg.umat+(arg.size?"\n3D-данные: размер - "+arg.size+"Mb":"")+
			"'><br/>"+"<span>"+arg.matgname+" ("+arg.matgcode+") "+arg.umat+"</span><br/>";  
			return ""; 
		}
		confCaros[queryId].id = queryId;
		confCaros[queryId].url = "/mat";
		confCaros[queryId].query = {abs:abstract_id,start:0,count:5};
		confCaros[queryId].startup();
		
		checkElement.stop().animate({'height':'toggle'}, 300);	
		if((checkElement.is('div.carusel')) && (checkElement.is(':visible'))) {
			return false;
		}
		
	});
});

Но не так все равно. Подскажите, как это можно реализовать. Надеюсь, что хоть что-то понятно...

Answer 1

[Юрий Лобанов]

Думаю, что надо Вам все это делать через data-атрибуты.
Кликаете по строке таблицы, а в ней в data-атрибутах будет карусель, которую надо вывести и блок, в который эту карусель надо вывести.

Comments

[Romantik1991]

дело не в том куда вывести (она и сейчас выводится), а в том если я буду задавать вот так interCaros.itm_height = 150; то все норм, но так я могу задать в случае когда в одном определенном блоке нужно вывести и я знаю id и просто прописываю его. А мне нужно несколько с разными именами как-то так confCaros[queryId].itm_height = 100; где queryId значение id нужного блока. И вот если так делаю, то ошибка Uncaught TypeError: Object # has no method 'next'. Метод next срабатывает при клике на стрелку вправо. И не пойму как это можно решить.

Answer 2

[Romantik1991]

дело не в том куда вывести (она и сейчас выводится), а в том если я буду задавать вот так interCaros.itm_height = 150; то все норм, но так я могу задать в случае когда в одном определенном блоке нужно вывести и я знаю id и просто прописываю его. А мне нужно несколько с разными именами как-то так confCaros[queryId].itm_height = 100; где queryId значение id нужного блока. И вот если так делаю, то ошибка Uncaught TypeError: Object # has no method 'next'. Метод next срабатывает при клике на стрелку вправо. И не пойму как это можно решить.