Datepicker In Jquery Is Not Loaded For The Second Time

I have a datepicker in my page and also I have two radio buttons as follows. Radio 1

$(function() {   
   $(".radio1").change(function () {    
    if($(".radio1:checked").val()=="radio2"){
      $('#mydatepicker').datepicker('destroy');
        $('#mydatepicker').datepicker({
          format: 'dd/mm/yyyy',        
          minDate: '11/23/2015'
        });
    }else{
      $('#mydatepicker').datepicker('destroy');
      $('#mydatepicker').datepicker({
          format: 'dd/mm/yyyy',                  
        });      
   }
  });
 $('#mydatepicker').datepicker({format: 'dd/mm/yyyy'}); 
  });

HTML:

 <inputtype="radio"class="radio1" name="radio1" value="radio1" checked> Radio 1 
 <inputtype="radio"class="radio1" name="radio1" value="radio2" >Radio 2<inputtype="text"id="mydatepicker" 
         aria-controls="sample_1"class="form-control input-small input-inline" >

Fiddle

update:

we have used the destroy to create new instance of datepicker jQuery DatePicker -- Changing minDate and maxDate on the fly see this

Solution 2:

I faced similar issue. In my case it was a dropdown and based on the dropdown it I was disabling certain days in the datepicker. It was working for the change I made. But for second change it was not working.

Finally the solution I got was datepicker('remove').

So this should work with just adding one line of code in the change function.

$('#mydatepicker').datepicker('remove');

So your code should like this:

$(".radio1").change(function () {
$('#mydatepicker').datepicker('remove');
if($(".radio1:checked").val()=="radio2"){
  $('#mydatepicker').datepicker('destroy');
    $('#mydatepicker').datepicker({
      format: 'dd/mm/yyyy',        
      minDate: '11/23/2015'
    });
}else{
  $('#mydatepicker').datepicker('destroy');
  $('#mydatepicker').datepicker({
      format: 'dd/mm/yyyy',                  
    });      

} });