不显示jQuery的日期选择器altFormat(jQuery datepicker altForm

2019-09-01 18:41发布

我有一个是基于卖方的语言首选项本地化jQuery的日期选择器。 每个日期选择定制有不同的日期格式,但我希望在提交表单是在解析特定的格式输入。 我试图用altFormat上的日期选取器将其设置为“MM / DD / YY”,但我不希望向用户显示格式的日期。 有没有办法做到这一点。 即是有办法有从日期选择不同的日期格式创建的JavaScript Date对象时,评价为相同的日期?

Answer 1:

为什么你不希望使用altFormat与altField ?

在一个简单的例子,在这里你可以存储和访问的日期在你想要的格式mm/dd/yy同时显示在“他”的所需格式的用户。 见我的jsfiddle在按钮单击显示格式的变化,但在altField的格式不对。

<input type="text" id="datepicker">
<input type="button" id="changeFormat" value="Change!">
<!-- this would be a hidden input -->
<input type="text" id="altFormat">

$(document).ready(function () {

    $('#datepicker').datepicker({
        dateFormat: "dd.mm.yy",
        altFormat: "dd/mm/yy",
        altField: '#altFormat'
    });
    $('#changeFormat').click(function () {
        //changes the dateformat the user sees
        $('#datepicker').datepicker('option', 'dateFormat', 'dd-mm-yy');
        console.log($('#datepicker').datepicker('option', 'altFormat'));
    });
});

((意外地用于DD / MM / YY代替MM / DD / YY在第一示例))

编辑

工作示例存储在日期mm/dd/yy格式data-altformat属性,它可以方便地与访问

$('#datepicker').data('altformat'); //outputs e.g. 05/31/2013

ONSELECT我做了的currentdate的值存储在属性

onSelect: function () {
    //gets your desired format
    var altFormat = $(this).datepicker('option', 'altFormat');
    //get current date in user format
    var currentDate = $(this).datepicker('getDate');
    //format from user format to desired format
    var formatedDate = $.datepicker.formatDate(altFormat, currentDate);
    //set data-* attribute to formatedDate
    $('#datepicker').data('altformat', formatedDate);
    $('#altFormat').val(formatedDate);
}

这种方法的好处是,你不需要一个隐藏的输入了。 我希望这可以帮助你。

EDIT2

只注意到你不需要new Date().datepicker('getDate')



Answer 2:

好点的,SirDerpington,

但是我无法找到这一个功能齐全的MVC解决方案。 当时的想法是使用altFormat实际数据提交和DATEFORMAT - 只是为了显示(考虑到UI区域性或只是一个预定义的格式人喜欢)。

最后,我有我的解决方案,这是(唉,基于命名约定至今):

@model System.DateTime ?
@Html.Hidden("", Model.HasValue ? string.Format("{0:yyyy-MM-dd}", Model.Value) : string.Empty)
@Html.TextBox("", Model.HasValue ? string.Format("{0:dd.MM.yyyy}", Model.Value) : string.Empty, new { @class = "date", Id = "DatePicker" + ViewData.ModelMetadata.PropertyName, Name = "DatePicker" + ViewData.ModelMetadata.PropertyName })

<script type="text/javascript">
$(document).ready(function () {
    $.validator.methods.date = function (value, element) {
        return $("form").validate().element('#' + this.id.replace('DatePicker', ''));
    };
    $('.date').datepicker({
        changeMonth: true,
        changeYear: true,
        dateFormat: 'dd.mm.yy',
        altFormat: 'yy-mm-dd',
        onClose: function () {
            var altFormat = $(this).datepicker('option', 'altFormat');
            var dateFormat = $(this).datepicker('option', 'dateFormat');
            var currentDate = $(this).datepicker('getDate');
            var formattedDate = $.datepicker.formatDate(altFormat, currentDate);
            $('#' + this.id.replace('DatePicker', '')).val(formattedDate);
        }           
    });
});
</script>

[MetadataType(typeof(EmployeeMetadata))]
public partial class Employee
{
}

class EmployeeMetadata
{
    [DataType(DataType.MultilineText)]
    public string Description { get; set; }
    [DataType(DataType.Date)]
    [DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]
    [Display(Name = "Employment Date")]
    public Nullable<System.DateTime> EmploymentDate { get; set; }
}

UPD:我现在已经安装Globalize的简化的东西。 但我仍然不能使它正常工作。 此事全球化时代是已经包含了所有的文化设置。 但似乎是的DatePicker需要一个单独的“每个文化”区域文件(的区域性设置阵列),事实上,包含了相同的设置Globalize的! 这是愚蠢的! 全球文化的设置应该是所有控件一样! 我仍然无法相信我将不得不寻找特定文化的日期选择文件,使这种重复... :(



文章来源: jQuery datepicker altFormat not displayed