[JavaScript][PHP]Datepicker - Aktywacja tygodnia wg daty Opcje

[rafik73]

Witam
Jak zrobić taki efekt?
Klikam w element (np. textbox), który zawiera datę w formacie 2016-12-28
Przykładowa podana data to środa.
Chcę, by po kliknięciu otworzył się kalendarzyk (datepicker), w którym aktywne
są tylko dni od poniedziałku do piątku które zawierają tą datę.
Kalendarzyk ma nie mieć możliwości zmiany miesiąca i roku (to potrafię).

[trueblue]

Znajdź datepicker z możliwością podania zakresu możliwych dat. Zakres ten ustawisz na podstawie określonej daty (albo przy inicjalizacji/otwieraniu datepickera w JS, albo w PHP wdrukowując parametry przy inicjalizacji).

[viking]

https://uxsolutions.github.io/bootstrap-datepicker/

[rafik73]

Takie cóś znalazłem

http://jsfiddle.net/yXMKC/4/

[Niree]

Datepickerrange, zainteresuj się tym :-)

[rafik73]

Jak zmienne:

[JAVASCRIPT] pobierz, plaintext 
var a="2016-12-15";
var b="2016-12-18";
var c="2016-12-21";
[JAVASCRIPT] pobierz, plaintext 

podstawić do zmiennej availableDates ?

tak działa:

[JAVASCRIPT] pobierz, plaintext 
var availableDates = ["2016-12-15","2016-12-18","2016-12-21"];
[JAVASCRIPT] pobierz, plaintext 

tak nie:

[JAVASCRIPT] pobierz, plaintext 
var availableDates = [a,b,c];
[JAVASCRIPT] pobierz, plaintext 

zmienna podstawiana do funkcji:

[JAVASCRIPT] pobierz, plaintext 
beforeShowDay: function (date) {
  dmy = date.getFullYear() + "-" + (date.getMonth()+1) + "-" + date.getDate();
 
  if ($.inArray(dmy, availableDates) != -1) {
    return [true, "","dostępne"];
  } else {
    return [false,"","niedostępne"];
  }
[JAVASCRIPT] pobierz, plaintext 

Zmienne a,b,c pobieram z inputa w formacie daty , np: 2016-12-15

[trueblue]

Czy zmienne a, b, c są widoczne w miejscu gdzie deklarujesz zmienną availableDates? Jeśli nie, to zadeklarowałeś je poza zasięgiem tego fragmentu skryptu.
W jakim momencie inicjujesz skrypt datepickera, czy nie wcześniej niż zmienną availableDates?

[rafik73]

[JAVASCRIPT] pobierz, plaintext 
$(function(){
 
 $(document).on("click",".oz_m_data",function(){
 
    var a = $(this).val();
 
    var b = "2016-12-18";
      alert(a);
    		//	var availableDates = ["2016-12-9","2016-12-14","2016-12-15"];  
      var availableDates = new Array;
      availableDates[0] = a;  
      availableDates[1] = b; 
 
                $('.oz_m_data').datepicker({   
                  inline: true,
                  //showOtherMonths: true,
                  //selectOtherMonths: true,
                   changeMonth: true,
                   changeYear: true,
                   showButtonPanel: true,
                //beforeShowDay: function(date){ return [date.getDay() == 0,""]}
 
 
              beforeShowDay: function (date) {
  dmy = date.getFullYear() + "-" + (date.getMonth()+1) + "-" + date.getDate();
 
  if ($.inArray(dmy, availableDates) != -1) {
    return [true, "","dostępne"];
  } else {
    return [false,"","niedostępne"];
  }
 
}
                ,
                  onSelect: function() {}
 
                });
                 });
                  });
[JAVASCRIPT] pobierz, plaintext 

zmienna b (dzień 18) działa ok, zmienna a (dzień 16) na pół gwizdka, tzn. wyświetla ją aktywną ale nie podświetloną jak zmienna b

[trueblue]

Wyjmij tworzenie datepickera z obsługi zdarzenia click.
Zainicjuj go przed tą funkcją, a w obsłudze click użyj: https://api.jqueryui.com/datepicker/#method-option

[rafik73]

O to ci chodziło :

$( ".oz_m_data" ).datepicker( "option" );

[trueblue]

Nie.
O to abyś ustawiał opcję availableDates za pomocą tej metody.

[rafik73]

Ni w ząb nie mogę tego ugryźć

Próbuję tak:

$( ".oz_m_data" ).datepicker( "option" , availableDates);

i nic

Ten post edytował rafik73 31.12.2016, 15:49:57

[trueblue]

Teraz widzę, że availableDates nie jest opcją, ale jest wykorzystywana w funkcji beforeShowDay.

Niemniej:

[HTML] pobierz, plaintext 
 $(function() {
 
 
    $('.oz_m_data').datepicker({
      inline: true,
      //showOtherMonths: true,
      //selectOtherMonths: true,
      changeMonth: true,
      changeYear: true,
      showButtonPanel: true,
      //beforeShowDay: function(date){ return [date.getDay() == 0,""]}
 
 
      beforeShowDay: function(date) {
        dmy = date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate();
 
      var a = $('.oz_m_data').val();
 
      var b = "2016-12-18";
      alert(a);
      //	var availableDates = ["2016-12-9","2016-12-14","2016-12-15"];  
      var availableDates = new Array;
      availableDates[0] = a;
      availableDates[1] = b;
 
        if ($.inArray(dmy, availableDates) != -1) {
          return [true, "", "dostępne"];
        } else {
          return [false, "", "niedostępne"];
        }
 
      },
      onSelect: function() {}
 
    });
 
 
  });
[HTML] pobierz, plaintext 

Ten post edytował trueblue 31.12.2016, 17:06:43

[rafik73]

nalazłem takie rozwiązanie:

[JAVASCRIPT] pobierz, plaintext 
$(function() {
    $(".oz_m_data").click(function() {
        $(this).datepicker().datepicker( "show" )
    });
});
[JAVASCRIPT] pobierz, plaintext 

łańcuszek

[JAVASCRIPT] pobierz, plaintext 
.datepicker( "show" )
[JAVASCRIPT] pobierz, plaintext 

zdecydowanie rozszerzył możliwości operowania zmiennymi.