Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Re-initialize or destroy Bootstrap datepicker dynamically

Is there a way to destroy the Bootstrap datepicker dynamically updating its options like format, beforeShowDay, etc.? I know that the jQuery UI datepicker has a destroy method but Bootstrap's has not. It only has the .('remove') method but its not working.

My goal is to modify the options of the datepicker when changing an input, for example:

$('#employee').change( function() {
   $('#date').datepicker('destroy'); //not working 'cause bootstrap hasnt a destroy method
   $('#date').hide();
});

Then I call the initialize function when the input changes:

function updateCalendar(){
     $('#date').datepicker({
          format:"dd/mm/yyyy",
          beforeShowDay: updateC  //function that modifies the available days to show
     });    
 }
like image 456
dan Avatar asked May 10 '14 14:05

dan


People also ask

How do I reinitialize datepicker?

I would do it like this: $('#sv_pickup_date'). datepicker('destroy'). datepicker({ format: 'dd/mm/yyyy' , autoclose: true , startDate: '20/08/2018' , endDate: '24/08/2018' });

How do I destroy datepicker?

To destroy a datepicker in jQuery UI, we will be using destroy() method. jQuery UI destroy() method is used to remove the complete functionality of the datepicker(). Parameters: This method does not accept any parameters.

How do I unbind a datepicker?

You can try the enable/disable methods instead of using the option method: $("#txtSearch"). datepicker("enable"); $("#txtSearch"). datepicker("disable");


2 Answers

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

Make sure you have your date picker object in DOM before removing it. Without removing you can hide the calendar and change the format of date and update it .

$('.datepicker').datepicker('update');
like image 142
Rajesh Madhu Avatar answered Oct 12 '22 21:10

Rajesh Madhu


You can Use:

$('#element_id').datepicker('destroy');

I called this just outside my ajax call. My ajax call was creating the datepicker dynamically. After the call was made I destroyed the object.

Like below:

$.ajax({ url: 'my_ business_functions.php',
     data: {func_call: 'my_method_name', my_parameter: my_parameters},
     type: 'post',
     success: function(output) {
         //all my stuffs here
        $('#element_id').val(datepicker_value);
        }
    });
    $('#element_id').datepicker('destroy');

This served my purpose.

like image 34
Anirban Avatar answered Oct 12 '22 22:10

Anirban