ブートストラップのdatetimepickerを新しいフォーマットで再初期化する

フォームに日付と時刻のフィールドが少なく、フォームが読み込まれるときに日付と時刻の形式がmm/dd/yyyy、hh：mm aになります。ユーザーはロケールのドロップダウン値を変更します米国以外の場合は、時刻の日付と時刻の形式をdd/mm/yyyyとHH：mm形式に変更する必要があります。私はデタッチし、コールバック関数でdatetimepickerを再初期化しようとしましたが、ピッカーは新しい形式で更新されていません。私は日付フィールドの次のコードを試してみました。ブートストラップのdatetimepickerを新しいフォーマットで再初期化する

$('.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')); 
       });

出典

2016-06-13 user1614862

最近似たようなことをしましたが、私はチェックボックスの状態が変わるとフォーマットを変更しました。私はこれが役立つことを願っています

  
 
// 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"); 
 
    
 
     } 
 
      
 
});

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet"/> 
 
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script> 
 
<link href="https://cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/e8bddc60e73c1ec2475f827be36e1957af72e2ea/build/css/bootstrap-datetimepicker.css" rel="stylesheet"/> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment-with-locales.js"></script> 
 
<script src="https://cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/e8bddc60e73c1ec2475f827be36e1957af72e2ea/src/js/bootstrap-datetimepicker.js"></script> 
 

 

 

 
<body> 
 

 
<div class="checkbox"> 
 
    <label> 
 
    <input type="checkbox" id="interval" > 
 
    time: 
 
    </label> 
 
</div> 
 

 

 

 
<div class='col-sm-3'>   
 
    <div class="form-group" > 
 
     <div class='input-group date' id="datetimepicker1" > 
 
       <input type="text" class="form-control" placeholder="Select Date" /> 
 
       <span class="input-group-addon"> 
 
        <span class="glyphicon glyphicon-calendar "></span> 
 
       </span>     
 
     </div> 
 
    </div> 
 
</div> 
 

 
</body>

出典

2016-06-21 13:42:13 bmenyhart

ブートストラップのdatetimepickerを新しいフォーマットで再初期化する

答えて

関連する問題