Показать сообщение отдельно
  #1 (permalink)  
Старый 13.01.2014, 21:00
Интересующийся
Отправить личное сообщение для martinss Посмотреть профиль Найти все сообщения от martinss
 
Регистрация: 29.12.2010
Сообщений: 24

jQuery UI Tabs hash
Добрый день, перейду сразу к описанию проблемы:

Есть страница с jquery ui tabs. Например
URL [url]http://site.xx/page-1[/url]


По кликам на вкладки в URL строке ничего не добавляется (
location.hash
)
Это не удобно. Нужно сделать так, чтобы hash все же дорисовывался, однако не просто так:
http://site.xx/page-1#tab-1
[url]http://site.xx/page-1#tab-2[/url]


Это будет дергать экран пользователя, а это не хорошо. Поэтому идея такая - передавать hash почти как get параметр, взять его из URL не сложно, а дергаться экран не будет.

Вот пример того, как нужно (добавил id вкладки как параметр p= ) :
http://site.xx/page-1#p=tab-1
[url]http://site.xx/page-1#p=tab-2[/url]


Вот что у меня получилось:
$(".tabs").tabs({
	select: function(event, ui) {
		var param = '';
		param = window.location.hash;

		if(param.indexOf('p=') > 0)
		{
			var regexp = /#p=(.+)/i;
			var hash = param.match(regexp)[1];

			if(hash !== '' && hash != ui.tab.hash)
			{
				window.location.hash = '#p=' + ui.tab.hash.substr(1);
			}
		}
	},
	show: function(event, ui) {
		var param = '';
		param = window.location.hash;

		if(param.indexOf('p=') > 0)
		{
			var regexp = /#p=(.+)/i;
			var hash = param.match(regexp)[1];

			if(hash !== '')
			{
				$('.tabs').tabs("select", hash);
			}
		}

	}
});


Собственно суть проблемы: реализация очень емкая и подглючивает. Сталкивался ли кто с таким уже? Если не жалко, поделитесь решением Заранее благодарен.

Ах да, чуть не забыл. По клику по табам, url (значение параметра p) должно меняться, чтобы непример можно было скопировать url и кинуть его кому-нибудь.


Как бонус: более интересный вариант реализации: если табы вложенные, как тогда?
Например каждая вкладка с табами содержит еще по 1 табу с тремя вкладками.
Пока есть только размышления: передавать второй параметр, если есть вложенный таб, а в коде через find искать - есть ли у текущего tab вложенные, если да и параметр №2 передан, то делать оба активными, иначе по умолчанию первый из главного таба и первый из второго.
Вот только как это закодать.....
Ответить с цитированием