JqueryのDatepickerとセレクタ

Question

私は "Dynamic"の日付ピッカーを作ろうとしていますが、私がする必要があるのは、選択のオプションに基づいて、何日かの日を非アクティブにすることです。何かが好きです：オプション1を選択すると、すべての月曜日が無効になります。オプション2を選択すると、すべての木曜日は無効になり、続行されます。私は動作するコードを作ったが、あなたが選択したものを変更すると、最初の選択だけを保持している。

ものはコードです：

のjQuery：

$('#comuna_select').change(function(){ 
    if($(this).val() == 'Cachapoal/Codegua'){ 
     function DisableCodegua(date) { 
      var day = date.getDay(); 
      // If day == 1 then it is MOnday 
      if (day == 0 || day == 1 || day == 2 || day== 3 || day == 5 || day == 6) { 
       return [false] ; 
      } else { 
       return [true] ; 
      } 
     } 

     $("#datepicker").datepicker({ 
      dateFormat: 'dd-mm-yy', 
      defaultdate: currentDate, 
      changeMonth: true, 
      changeYear: true, 
      yearRange: "-2:+2", 
      beforeShowDay: DisableCodegua, 
      minDate: '-1D', 
      maxDate: '+45D', 
     }); 
    } else if ($(this).val() == 'Cachapoal/Coinco'){ 
     function DisableCoinco(date) { 
      var day = date.getDay(); 
      // If day == 1 then it is MOnday 
      if (day == 0 || day == 1 || day == 2 || day== 3 || day == 4 || day == 6) { 
       return [false] ; 
      } else { 
       return [true] ; 
      } 
     } 

     $("#datepicker").datepicker({ 
      dateFormat: 'dd-mm-yy', 
      defaultdate: currentDate, 
      changeMonth: true, 
      changeYear: true, 
      yearRange: "-2:+2", 
      beforeShowDay: DisableCoinco, 
      minDate: '-1D', 
      maxDate: '+45D', 
     }); 
    } 
}); 

そしてHTML：

<select name="comuna" class="form-control" tabindex=8 id="comuna_select" required> 
    <option disabled selected style="font-color: #ccc;">Comuna</option> 
    <option value="Cachapoal/Codegua">Cachapoal/Codegua</option> 
    <option value="Cachapoal/Coinco">Cachapoal/Coinco</option> 
</select> 
<input id="datepicker" type="text" name="fecha" class="form-control" tabindex=9 placeholder="Click para seleccionar fecha" required/> 

私も、このためにブートストラップを使用しています、私は日付ピッカーのために使用するもののthats推測。

PD：私はこれのためにフィドルを作成しようとしましたが、何らかの理由でそれを動作させることができません。

希望はありがとう、ありがとう！

Answer 1

datepickerにdestroyとrefreshを追加しました。

JS：

$('#comuna_select').change(function(){ 
    $("#datepicker").datepicker("destroy"); 
    if($(this).val() == 'Cachapoal/Codegua'){ 
     function DisableCodegua(date) { 
      var day = date.getDay(); 
      // If day == 1 then it is Monday 
      if (day == 0 || day == 1 || day == 2 || day== 3 || day == 5 || day == 6) { 
       return [false] ; 
      } else { 
       return [true] ; 
      } 
     } 

     $("#datepicker").datepicker({ 
      dateFormat: 'dd-mm-yy', 
      defaultdate: currentDate, 
      changeMonth: true, 
      changeYear: true, 
      yearRange: "-2:+2", 
      beforeShowDay: DisableCodegua, 
      minDate: '-1D', 
      maxDate: '+45D', 
     }); 
    } else if ($(this).val() == 'Cachapoal/Coinco'){ 
     function DisableCoinco(date) { 
      var day = date.getDay(); 
      // If day == 1 then it is Monday 
      if (day == 0 || day == 1 || day == 2 || day== 3 || day == 4 || day == 6) { 
       return [false] ; 
      } else { 
       return [true] ; 
      } 
     } 

     $("#datepicker").datepicker({ 
      dateFormat: 'dd-mm-yy', 
      defaultdate: currentDate, 
      changeMonth: true, 
      changeYear: true, 
      yearRange: "-2:+2", 
      beforeShowDay: DisableCoinco, 
      minDate: '-1D', 
      maxDate: '+45D', 
     }); 
    } $("#datepicker").datepicker("refresh"); 
}); 

今すぐすべてが動作しています。