Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   jquery.cookie один работает - другой нет (https://javascript.ru/forum/jquery/43266-jquery-cookie-odin-rabotaet-drugojj-net.html)

Sveta 29.11.2013 10:07

jquery.cookie один работает - другой нет
 
Здравствуйте!
Не понимаю что происходит!
Хочу сохранять значения ползунков с помощью jquery.cookie
при установке ползунка пишу
$("#slider-range_oper").slider({
		  range: true,
		  min: maxYear-1,
		  max: maxYear,
		  values: [maxYear, maxYear],
		  slide: function( event, ui ) {
			$( "#startYear_oper" ).val( ui.values[ 0 ] );
			$( "#endYear_oper" ).val(  ui.values[ 1 ] );
		  },
		  change: function( event,ui){
			$.cookie("oper_year_start_Cookie", ui.values[ 0 ]);//при изменении положения ползунков сохраняю в куки
			$.cookie("oper_year_end_Cookie", ui.values[ 1 ]);//при изменении положения ползунков сохраняю в куки
		  }
		});
		$( "#startYear_oper" ).val( $( "#slider-range_oper" ).slider( "values", 0 ) );				
		$( "#endYear_oper" ).val(  $( "#slider-range_oper" ).slider( "values", 1 ) );

а вот и само создание куков
var cookie_oper_year_start = $.cookie("oper_year_start_Cookie");

if(cookie_oper_year_start == null)
{
 var cookie_value = $( "#slider-range_oper" ).slider( "values", 0 );
  $.cookie("oper_year_start_Cookie", cookie_value);
  cookie_oper_year_start = $.cookie("oper_year_start_Cookie");
}
else{
  $( "#slider-range_oper" ).slider( "values", 0,$.cookie("oper_year_start_Cookie"));
  $( "#startYear_oper" ).val( $( "#slider-range_oper" ).slider( "values", 0 ) );
  }
  
  //***************************************
  
 var cookie_oper_year_end = $.cookie("oper_year_end_Cookie");

if(cookie_oper_year_end == null)
{
 var cookie_value1 = $( "#slider-range_oper" ).slider( "values", 1 );
  $.cookie("oper_year_end_Cookie", cookie_value1);
  cookie_oper_year_end = $.cookie("oper_year_end_Cookie");
}
else{
  $( "#slider-range_oper" ).slider( "values", 1,$.cookie("oper_year_end_Cookie"));
  $( "#endYear_oper" ).val( $( "#slider-range_oper" ).slider( "values", 1 ) );
  }


Все это в функции ready
Так вот: работает только первый кук, а если я первый удаляю - то второй начинает работать...в чем дело?:cray:

Sveta 29.11.2013 11:59

maxYear глобальная переменная, равна 2013, а в values: [maxYear, maxYear] я задаю что по умолчанию оба ползунка слайдера стоят на максимальном значении) Но это не суть, такой же код я применяю для другого слайдера с ползунками, на котором по умолчанию стоит values: [-90, 90] и та же история - первый ползунок работает, а второй нет (точнее работают оба ползунка, но во запминается положение только первого...а второй при перезагрузке страницы снова на значение по умолчанию становится)....словно от порядка объявления зависит.....

Sveta 29.11.2013 12:06

Я кажется разобралась) все дело в вызове
change: function( event,ui){
				$.cookie("oper_year_start_Cookie", ui.values[ 0 ]);
				$.cookie("oper_year_end_Cookie", ui.values[ 1 ]);
			  }

при перезагрузке страницы она вызывается дважды, и когда она вызывается первый раз - то переписывает значение второго кука))) значит остается только как-то отличать события при вызове этой функции cange

Sveta 29.11.2013 12:16

Хмм...вы правы...изначально диапазон был большой, 1950 - 2013 и он используется чаще всего для него мне тоже нужно делать куки...но на отдельных страницах нужен лишь за два года....не знаю переделывать ли его, смотрится красиво) тем более удобно что одна страница похожа на другую, просто у одной будет маленький диапазон а у другой - большой)
Я вот теперь ломаю голову как отличать вызвана ли change функция одним или другим ползунком...?

Rise 29.11.2013 13:08

$(document)ready(function() {

	var maxYear = 2013;
	var minYear = maxYear - 10;

	if ($.cookie('oper_year_start_Cookie') == null) $.cookie('oper_year_start_Cookie', maxYear);
	if ($.cookie('oper_year_end_Cookie') == null) $.cookie('oper_year_end_Cookie', maxYear);

	$('#slider-range_oper').slider({
		range: true,
		min: minYear,
		max: maxYear,
		values: [$.cookie('oper_year_start_Cookie'), $.cookie('oper_year_end_Cookie')],
		slide: function(event, ui) {
			$('#startYear_oper').val(ui.values[0]);
			$('#endYear_oper').val(ui.values[1]);
			$.cookie('oper_year_start_Cookie', ui.values[0]);
			$.cookie('oper_year_end_Cookie', ui.values[1]);
		}
	});
	
	$('#startYear_oper').val( $('#slider-range_oper').slider('values', 0) );
	$('#endYear_oper').val( $('#slider-range_oper').slider('values', 1) );

});

Sveta 02.12.2013 11:47

этот вариант хорош, когда ползунки не меняются программно....а в моем случае есть ряд функций, которые изменяют положение ползунков...поэтому я и использую change (((((

Sveta 02.12.2013 12:18

Дело обстоит так: если я буду использовать изменение значения куков при событии slide то мне придется отдельно прописывать изменение куков в каждой функции где значение слайдера меняется программно. Здесь проблема: таких функций несколько, скрипт с ними находится в другом файле... возможно это и будет работать если довести до ума...но у меня не работало, значения портились в null...в общем, я решила что более простым и удобным решением будет использование change
как я поняла, понять какой их двух ползунков вызвал change нельзя( поэтому мне пришлось завсети переменную-флаг, которая запрещает изменение значения куков в случае если изменение положение слайдера вызвано при перезагрузке страницы...вообще говоря это правильно, хотя решение на мой взгляд не красивое(((
var flagChangeData1="1"; // флаг, указывающий, менять ли значение в coockie при вызове chahge
	if(document.getElementById('slider-range_his')!=null){
			$("#slider-range_his").slider({
			  range: true,
			  min: 1981,
			  max: maxYear,
			  values: [maxYear, maxYear],
			  slide: function( event, ui ) {
				$( "#startYear_his" ).val( ui.values[ 0 ] );
				$( "#endYear_his" ).val(  ui.values[ 1 ] );
			  },
			  change: function( event,ui){
				if(flagChangeData1=="1"){
					$.cookie("his_year_start_Cookie", ui.values[ 0 ]);
					$.cookie("his_year_end_Cookie", ui.values[ 1 ]);
				}
				flagChangeData1="1";
			  }
			});
			$( "#startYear_his" ).val( $( "#slider-range_his" ).slider( "values", 0 ) );	
			$( "#endYear_his" ).val(  $( "#slider-range_his" ).slider( "values", 1 ) );	

			//*******************start year**************************
			//$.cookie('his_year_start_Cookie', 'cookie_value');
			var his_year_start_Cookie = $.cookie("his_year_start_Cookie");
			if(his_year_start_Cookie  == null  )
			{
			 var cookie_value = $( "#slider-range_his" ).slider( "values", 0 );
			  $.cookie("his_year_start_Cookie", cookie_value);
			  his_year_start_Cookie = $.cookie("his_year_start_Cookie");
			}
			else{
				flagChangeData1="0";
			  $( "#slider-range_his" ).slider( "values", 0,$.cookie("his_year_start_Cookie"));
			  $( "#startYear_his" ).val( $( "#slider-range_his" ).slider( "values", 0 ) );
			  }
			  
			  //********************end year*******************
			 var his_year_end_Cookie = $.cookie("his_year_end_Cookie");

			if(his_year_end_Cookie  == null)
			{
			 var cookie_value1 = $( "#slider-range_his" ).slider( "values", 1 );
			  $.cookie("his_year_end_Cookie", cookie_value1);
			  his_year_end_Cookie = $.cookie("his_year_end_Cookie");
			}
			else{
				flagChangeData1="0";
			  $( "#slider-range_his" ).slider( "values", 1,$.cookie("his_year_end_Cookie"));
			  if($.cookie("his_year_end_Cookie")==maxYear && $.cookie("his_year_start_Cookie")==maxYear )$( "#slider-range_his" ).slider( "values", 0,$.cookie("his_year_start_Cookie"));
			  $( "#endYear_his" ).val( $( "#slider-range_his" ).slider( "values", 1 ) );
			  }
	  
	}

Sveta 02.12.2013 12:38

оооо!!! ui.handle - это то что я искала !!! Вот за это спасибо!!! Помогли!!!!

А теперь про бред)))) сама еле в голове держу как там и все завязано))) смотрите: после того как пользователь поменял ползунки, я сохранила их в куках - один кук для левого, один кук для правого, все это нужно для того, если пользователь уйдет со страницы а потом вернется - чтобы выбранные им значения остались! так вот пользователь вернулся, запускается ready-функция, и в момент
var his_year_start_Cookie = $.cookie("his_year_start_Cookie");
			if(his_year_start_Cookie  == null  )
			{
			 var cookie_value = $( "#slider-range_his" ).slider( "values", 0 );
			  $.cookie("his_year_start_Cookie", cookie_value);
			  his_year_start_Cookie = $.cookie("his_year_start_Cookie");
			}
			else{
				flagChangeData1="0";
			 [B] $( "#slider-range_his" ).slider( "values", 0,$.cookie("his_year_start_Cookie"));[/B]
			  $( "#startYear_his" ).val( $( "#slider-range_his" ).slider( "values", 0 ) );
			  }

запускается change так как положение ползунка меняется...вот тогда-то у меня одно из знаений затиралось))

Sveta 02.12.2013 12:47

$( "#slider-range_his" ).slider( "values", 0,$.cookie("his_year_start_Cookie"));
эта строчка в случае если значение куки не null

И, кстати, делаю вывод ui.handle в функции change выводит url страницы...а не индекс ползунка.....

Sveta 02.12.2013 13:10

ох...his...oper...что если я вам признаюсь что у меня еще ползунки есть?)) все сделаны по одному и тому же принципу.....это же не суть....суть в том что мне нужно использовать именно change и в том что при выводи ui.handler не зависимо правая или левая рукоятка изменила свое положение - выводится url страницы, а следовательно, понять какая из рукояток была передвинута - нельзя. (((((
Извините, если я иногда коряво выражаюсь, я стараюсь! В принципе, проблему я решила, как я и говорила, с помощью переменной-флага....но если вдруг вы знаете как отличить событие вызванное разными рукоятками - это было бы замечательно, если такое вообще возможно.


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