Reinitialize bootstrap datetimepicker with new format

Question

I have few date and time fields in my form, when the form is loaded the date and time format would be mm/dd/yyyy and hh:mm a, after user changes the locale dropdown value other than US then time date and time format should be modified to dd/mm/yyyy and HH:mm format. I tried to detach and reinitialize datetimepicker in my callback function, but the pickers are not getting updated with the new format. I tried the following code for date fields.

$('.datepicker').each(function() {
                    //detach
                    $(this).datetimepicker('remove');
                    //reinitialize
                    $(this).datetimepicker({
                        useCurrent: false,
                        format: "DD/MM/YYYY",
                        pickTime: false
                      });
                    $(this).attr("placeholder", "dd/mm/yyyy");
                    console.log( $(this).val() );
                        //$(this).val(moment($(this).val(), 'DD/MM/YYYY').format('MM/DD/YYYY'));
                });

bmenyhart · Accepted Answer

I made something similar recently, I changed format as a checkbox state changes. I hope this helps.

           
 // by default I set the  inputfield format to 'DD/MM/YYYY' 
  $(function () {
     $('#datetimepicker1').datetimepicker({                        
      allowInputToggle: true,
      format: 'DD/MM/YYYY'
     });
  });
  
 // I changed format of the inputfield as the checkbox state changes 
  $("#interval").change(function () {
     
    if($(this).prop("checked") == true){
  
        $('#datetimepicker1').data("DateTimePicker").format("DD/MM/YYYY HH:mm A");
    } else {
       $('#datetimepicker1').data("DateTimePicker").format("DD/MM/YYYY");
  
      }
         
 });












 
  
    
   time:

Reinitialize bootstrap datetimepicker with new format

Answers (1)

Related Questions