web-dev-qa-db-ja.com

日付ピッカーで日付形式（MM / DD / YY）を（YYYY-MM-DD）に変更する方法

次のdatepickerスクリプトがあります。

<script>
 $(function(){
        $("#to").datepicker();
        $("#from").datepicker().bind("change",function(){
            var minValue = $(this).val();
            minValue = $.datepicker.parseDate("mm/dd/yy", minValue);
            minValue.setDate(minValue.getDate()+1);
            $("#to").datepicker( "option", "minDate", minValue );
        })
    });
</script>

日付形式はMM/DD/YYです。日付形式をYYYY-MM-DDに変更する方法は？

javascriptjqueryjquery-uicalendar
48
John Ken

dateFormat オプションを使用します

 $(function(){
        $("#to").datepicker({ dateFormat: 'yy-mm-dd' });
        $("#from").datepicker({ dateFormat: 'yy-mm-dd' }).bind("change",function(){
            var minValue = $(this).val();
            minValue = $.datepicker.parseDate("yy-mm-dd", minValue);
            minValue.setDate(minValue.getDate()+1);
            $("#to").datepicker( "option", "minDate", minValue );
        })
    });

http://jsfiddle.net/gaby/WArtA/ のデモ

59
Gabriele Petrioli

以下を試してください：

$('#to').datepicker({
      dateFormat: 'yy-mm-dd'
});

あなたはそれがyyyy-mm-ddだと思うだろうが、まあまあ：P

35
Gazillion

私は同じ問題を抱えており、多くの答えを試しましたが、何もうまくいきませんでした。

私は以下を試してみましたが、うまくいきました：

<input type=text  data-date-format='yy-mm-dd'  >
22
Shiko
$( ".selector" ).datepicker( "option", "dateFormat", 'yy-mm-dd' );

参照： http://jqueryui.com/demos/datepicker/ および http://docs.jquery.com/UI/Datepicker/formatDate#utility-formatDate

7
Erik J. Olson

Jqueryでdateformatオプションが機能しない場合は、日付の入力フィールドのHTMLページでこの状況を処理できます。

<input type="text" data-date-format='yyyy-mm-dd'  id="selectdateadmin" class="form-control" required>

このページの下のjavascriptに、日付選択コードを追加します。

 $('#selectdateadmin').focusin( function()
     {
       $("#selectdateadmin").datepicker();
       
     });
3
Mohsin Shoukat

このアプローチを使用して、アプリで同じ操作を実行しました。

var varDate = $("#dateStart").val(); 

var DateinISO = $.datepicker.parseDate('mm/dd/yy', varDate); 

var DateNewFormat = $.datepicker.formatDate( "yy-mm-dd", new Date( DateinISO ) );

$("#dateStartNewFormat").val(DateNewFormat);
2
siwalikm

Datepickerの初期化中に次のようなものが必要です。

$("#your_elements_id").datepicker({ dateFormat: 'yyyy-mm-dd' });
2
Husein Roncevic

これもうまくいきました。 bootstrap-datepicker.jsに移動します。

このコードを置き換えます：

var defaults = $.fn.datepicker.defaults = {
                autoclose: false,
                beforeShowDay: $.noop,
                calendarWeeks: false,
                clearBtn: false,
                daysOfWeekDisabled: [],
                endDate: Infinity,
                forceParse: true,
                format: 'mm/dd/yyyy',
                keyboardNavigation: true,
                language: 'en',
                minViewMode: 0,
                multidate: false,
                multidateSeparator: ',',
                orientation: "auto",
                rtl: false,
                startDate: -Infinity,
                startView: 0,
                todayBtn: false,
                todayHighlight: false,
                weekStart: 0
        };

で：

var defaults = $.fn.datepicker.defaults = {
                autoclose: false,
                beforeShowDay: $.noop,
                calendarWeeks: false,
                clearBtn: false,
                daysOfWeekDisabled: [],
                endDate: Infinity,
                forceParse: true,
                format: 'yyyy-mm-dd',
                keyboardNavigation: true,
                language: 'en',
                minViewMode: 0,
                multidate: false,
                multidateSeparator: ',',
                orientation: "auto",
                rtl: false,
                startDate: -Infinity,
                startView: 0,
                todayBtn: false,
                todayHighlight: false,
                weekStart: 0
        };
2
gani024

これを試して：

$.datepicker.parseDate("yy-mm-dd", minValue);
1
Peng Qi

.formatDate( format, date, settings )を使用

http://docs.jquery.com/UI/Datepicker/formatDate

1
Vlad Dneprovskiy

.datepicker({})設定にdateFormat:'yy-mm-dd'を追加するだけで、.datepicker({})は次のようになります

            $( "#datepicker" ).datepicker({
                showButtonPanel: true,
                changeMonth: true,
                dateFormat: 'yy-mm-dd'
            });
          });

    </script>
1
K.R.Janssen

ここでyy-mm-ddを定義するだけです。 dateFormat

デフォルトはmm-dd-yy

Mm-dd-yyをyy-mm-ddに変更します。以下の例を見てください

  $(function() {
    $( "#datepicker" ).datepicker({
      dateFormat: 'yy-mm-dd',
      changeMonth: true,
      changeYear: true
    });
  } );

Date: <input type="text" id="datepicker">
0
Rokan Nashp

私のこの仕事：

 $('#data_compra').daterangepicker({
          singleDatePicker: true,
          locale: {
           format: 'DD/MM/YYYY'
          },
         calender_style: "picker_4", }, 
function(start, end, label) {
          console.log(start.toISOString(), end.toISOString(), label); 
});
0
Ediano Gama

これはすべてのdatePickerバージョンで私のために働いたもので、最初に日付を内部datePicker日付形式に変換してから、目的の形式に戻す

var date = "2017-11-07";   
date = $.datepicker.formatDate("dd.mm.yy", $.datepicker.parseDate('yy-mm-dd', date));
// 07.11.2017
0
FantomX1

this 私のために働いた。

    $('#thedate').datepicker({
    dateFormat: 'dd-mm-yy',
    altField: '#thealtdate',
    altFormat: 'yy-mm-dd'
});
0
Narendra Kothule

全てに感謝。期待どおりの出力が得られました

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css" type="text/css" media="all">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/jquery-ui.min.js"></script>

<script>
$(function(){
        $("#to").datepicker({ dateFormat: 'yy-mm-dd' });
        $("#from").datepicker({ dateFormat: 'yy-mm-dd' }).bind("change",function(){
            var minValue = $(this).val();
            minValue = $.datepicker.parseDate("yy-mm-dd", minValue);
            minValue.setDate(minValue.getDate()+1);
            $("#to").datepicker( "option", "minDate", minValue );
        })
    });

</script> 

<div class="">
    <p>From Date: <input type="text" id="from"></p>

    <p>To Date: <input type="text" id="to"></p>
</div>
0
John Ken

Datetimepicker jqueryプラグイン形式の私にとっては、「d/m/Y」オプションが機能しています

$("#dobDate").datetimepicker({
lang:'en',
timepicker:false,
autoclose: true,
format:'d/m/Y',
onChangeDateTime:function( ct ){
   $(".xdsoft_datetimepicker").hide();
}
});
0
surya