Форум

Эдди · #21 (**permalink**) 21.06.2014, 13:42

Сообщение от рони

да если это строка 33 или подобная - dates становится доступно везде -- и естественно к моменту выбора даты массив уже должен быть заполнен, как поступать до прихода данных выбор за вами

Все ясно. Делаю.

Эдди · #22 (**permalink**) 21.06.2014, 20:54

Не могу же я без вопросов к гуру.
Вот функция анимации при ожидании ответа сервера:

//АНИМАЦИЯ ПРИ ОЖИДАНИИ ОТВЕТА СЕРВЕРА
  function startLoadingAnimation() //функция запуска анимации
  {
    //Находим элемент с изображением загрузки и убераем его невидимость
    var imgObj = $("#waiting");
    imgObj.show();
    //Вычисляем центр страницы, чтобы анимация оказалось в центре
    var centerY = $(window).scrollTop() + ($(window).height() + imgObj.height())/2;
    var centerX = $(window).scrollLeft() + ($(window).width() + imgObj.width())/2;
    //Меняем координаты изображения на нужные
    imgObj.offset({top:centerY, left:centerX});
  }
  function stopLoadingAnimation() //функция останавливающая анимацию
  {
    $("#waiting").hide(); //просто скрываем анимацию
  }

Но если страница не помещается в экран, то изображение выводится в центр целой страницы. То есть, если страница длинная, с полосой прокрутки, изображение выводится в центр не первого фрагмента, а в центр целой страницы.
Не знаю, понятно ли объяснил.

рони · #23 (**permalink**) 21.06.2014, 20:56

Сообщение от Эдди

понятно ли объяснил.

нет

рони · #24 (**permalink**) 21.06.2014, 20:58

Эдди,
может вы это хотели
Вывод изо в видимой области экрана

рони · #25 (**permalink**) 21.06.2014, 21:03

Эдди,

jQuery.fn.center = function()
	{
	var w = $(window);
	this.css("position","absolute");
	this.css("top",(w.height()-this.height())/2+w.scrollTop() + "px");
	this.css("left",(w.width()-this.width())/2+w.scrollLeft() + "px");
	return this;
	}

      //АНИМАЦИЯ ПРИ ОЖИДАНИИ ОТВЕТА СЕРВЕРА
  function startLoadingAnimation() //функция запуска анимации
  {
    //Находим элемент с изображением загрузки и убераем его невидимость
    $("#waiting").show().center();
  }
  function stopLoadingAnimation() //функция останавливающая анимацию
  {
    $("#waiting").hide(); //просто скрываем анимацию
  }

Эдди · #26 (**permalink**) 22.06.2014, 08:21

Супер. только картинка все равно прокручивается вместе со страницей.

Эдди · #27 (**permalink**) 22.06.2014, 09:36

И последний, кажется, вопрос по календарю:
Дата выводится в input

<input disabled type="text" name="datepicker" id="datepicker" value="<?=$curdate?>" style="width: 135px; margin-left: 4px; text-align: center" />

Так вот, значение инпута value игнорируется (в переменной $curdate находится сегодняшняя дата + 1 день).
Не нахожу опцию в datepicker, которая устанавливала бы дату по умолчанию. А то дата выводится последняя выбранная.

рони · #28 (**permalink**) 22.06.2014, 10:24

Эдди,
сохранить вставить после инициализации
UI datepicker отображение произвольной даты при загрузке

рони · #29 (**permalink**) 22.06.2014, 10:46

Эдди,

<!doctype html>



<html lang="en">

<head>

  <meta charset="utf-8" />

  <title>jQuery UI Datepicker - Default functionality</title>

  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/sunny/jquery-ui.css" />

  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>

  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

  <link rel="stylesheet" href="/resources/demos/style.css" />
   <style type="text/css">

   body{
     font-size: 12px;
   }
.active .ui-state-default{
    background: rgba(102, 255, 102, 1)
}
.active:hover .ui-state-default{
    background: rgba(255, 255, 0, 1)
}
   </style>
  <script>

  $(function() {

    $.datepicker.regional['ru'] = {
		closeText: 'Закрыть',
		prevText: '&#x3c;Пред',
		nextText: 'След&#x3e;',
		currentText: 'Сегодня',
		monthNames: ['Январь','Февраль','Март','Апрель','Май','Июнь', 'Июль','Август','Сентябрь','Октябрь','Ноябрь','Декабрь'],
		monthNamesShort: ['Янв','Фев','Мар','Апр','Май','Июн', 'Июл','Авг','Сен','Окт','Ноя','Дек'],
		dayNames: ['воскресенье','понедельник','вторник','среда','четверг','пятница','суббота'],
		dayNamesShort: ['вск','пнд','втр','срд','чтв','птн','сбт'],
		dayNamesMin: ['Вс','Пн','Вт','Ср','Чт','Пт','Сб'],
		dateFormat: 'dd.mm.yy',
		firstDay: 1,
		isRTL: false,
		showOtherMonths:true,
		selectOtherMonths:true,
		changeMonth:true,


        changeYear: false,
        showAnim:"scale"
};

var dates = ['28-06-2014','05-07-2014'];
$.datepicker.setDefaults($.datepicker.regional['ru']);
$( '#datepicker' ).datepicker({
        dateFormat: "dd-mm-yy",
        altField: "#datepicker_hid", altFormat: "yy-mm-dd", //формат даты для передачи php-скрипту
        minDate: "+1",
        beforeShowDay: disable}).datepicker( "setDate", $( "#datepicker" )[0].defaultValue );
function disable(d) {
       d = $.datepicker.formatDate("dd-mm-yy", d);
       d = $.inArray(d, dates);
       return [d != -1];
    }
})
  </script>
</head>
<body>  <label><input id='datepicker_hid'> Скрытое поле для отправки на сервер</label>
<label><input id='datepicker' value='28-06-2014'> Видимое для клиента нажать выбрать дату</label>
</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript