如何在日期选择器中将日期格式(MM / DD / YY)更改为(YYYY-MM-DD)

时间:2011-09-21 12:51:52

标签: javascript jquery jquery-ui javascript-events calendar

我有foll0wing 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> 

现在dateformat是MM / DD / YY。如何将日期格式更改为YYYY-MM-DD

17 个答案:

答案 0 :(得分:54)

使用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/

演示

答案 1 :(得分:35)

尝试以下方法:

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

你认为它会是yyyy-mm-dd但是很好:P

答案 2 :(得分:19)

我有同样的问题,我尝试过很多答案,但没有任何效果。

我尝试了以下内容并成功运作:

<input type=text  data-date-format='yy-mm-dd'  > 

答案 3 :(得分:7)

$( ".selector" ).datepicker( "option", "dateFormat", 'yy-mm-dd' );

请参阅: http://jqueryui.com/demos/datepicker/http://docs.jquery.com/UI/Datepicker/formatDate#utility-formatDate

答案 4 :(得分:3)

如果在jquery中dateformat选项不起作用,那么我们可以在你日期的输入字段的html页面中处理这种情况:

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

在此页面下方的javascript中添加您的日期选择器代码:

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

答案 5 :(得分:2)

在初始化datepicker期间,你需要这样的东西:

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

答案 6 :(得分:2)

这对我也有用。转到 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
	};

with:

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
	};

答案 7 :(得分:2)

我使用这种方法在我的应用程序中执行相同的操作。

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);

答案 8 :(得分:1)

试试这个:

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

答案 9 :(得分:1)

使用.formatDate( format, date, settings )

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

答案 10 :(得分:1)

只需将dateFormat:'yy-mm-dd'添加到您的.datepicker({})设置,您的.datepicker({})就会显示如下

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

    </script> 

答案 11 :(得分:0)

只需在此处定义 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">

答案 12 :(得分:0)

对于我的datetimepicker jquery插件格式:&#39; d / m / Y&#39;选项工作

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

答案 13 :(得分:0)

这对每个datePicker版本都有用,首先将日期转换为内部datePicker日期格式,然后将其转换回所需的日期格式

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

答案 14 :(得分:0)

这项工作对我来说:

$timeout(function() { 
        paginationService.setCurrentPage('ID', Math.ceil(paginationService.getCollectionLength("ID")/ITEMSPERPAGE));
    });

答案 15 :(得分:0)

this为我工作。

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

答案 16 :(得分:0)

谢谢大家。我得到了预期的输出

<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>