JQuery - Оборот по количеству месяцев - Ползунок пользовательского интерфейса Jquery - PullRequest
Новая
       16

JQuery - Оборот по количеству месяцев - Ползунок пользовательского интерфейса Jquery

2 голосов
/ 10 марта 2010

Я столкнулся с интересной проблемой, пытаясь создать более удобный интерфейс, похожий на указатель даты. Я использую ползунок для изменения месяца в списке календаря (март 2010, апрель 2010, май 2010 и т. Д.). Очень простой макет здесь:

http://dev.primestudiosllc.com/riverbank/

Сначала мне нужно получить текущий месяц и установить его как начало ползунка. Тогда мне нужно будет установить максимум до 18 месяцев в будущем. Эта часть довольно проста. Проблема, с которой я сталкиваюсь, заключается в том, что когда я нажимаю на декабрь, следующая позиция на слайдере должна изменить год. Это то, с чем у меня проблемы. Вот текущий код, который я использую для слайдера: 

 $(function() {
  $("#slider-range-min").slider({
     range: "min",
     value: 3,
     min: 1,
     max: 18,
     animate: true,
     slide: function(event, ui) {
   $("#calendar").calendarWidget({
     month: ui.value,
     year: 2010        
   })
  }
});

 $("#calendar").calendarWidget({
   month: 2,
   year: 2010        
  })
;})

Пожалуйста, дайте мне знать, что я могу сделать, чтобы сделать эту работу. Большое спасибо всем!

-B

Ответы [ 3 ]

2 голосов
/ 10 марта 2010

Сорпигал прав ... но я предлагаю parseInt вместо int ... вот демо 

 $(function() {
    $("#slider-range-min").slider({
      range: "min",
      value: 3,
      min: 1,
      max: 18,
      animate: true,
      slide: function(event, ui) {
        $("#calendar").calendarWidget({
          month: (ui.value % 12),
          year: 2010 + parseInt(ui.value/12)             
         })
      }
    });

    $("#calendar").calendarWidget({
      month: 2,
      year: 2010              
     })
;})​
0 голосов
/ 10 марта 2010

решение

В той части, где вы звоните onSlide #calendar, вы должны пересчитать месяц и год: 

$(function() {
  //on the beginning of the script
  var smonth = 2, syear = 2010; //start-month, start-year
  $("#slider-range-min").slider({
     range: "min",
     value: smonth,
     min: smonth,    /* THIS WORKS FOR */
     max: smonth+17, /* NEXT 18 MONTHS */
     animate: true,
     slide: function(event, ui) {
   $("#calendar").calendarWidget({
     month: (ui.value-1) % 12, //months are 0..11, so if you want to have 3=march on slider, -1 from ui.value :]
     year: syear+parseInt(ui.value / 12)
   })
  }
});

 $("#calendar").calendarWidget({
   month: smonth,
   year: syear        
  })
;})
0 голосов
/ 10 марта 2010

Попробуйте: 

 month: ui.value%12,

Когда пройдет декабрь, он "обернется"

А за год: 

 year: 2010 + int(ui.value>0?ui.value/12:0)

Так что это также увеличивает год.

...