Datepicker更改日期触发两次

时间:2016-05-25 10:39:50

标签: javascript jquery datepicker

我正面临这样的问题:日期更改触发两次,用户选择日期,日期格式为“dd-mm-yyyy”,但当用户点击日期字段或更改日期时,它将变为“YYYY-MM-DD”(我需要在提交时采用这种格式)

我不确定我在这里做错了什么。

相关代码:

<input type="text" data-bind="value: DateOfBirth" value="" required="" name="DateOfBirth" id="DateOfBirth" placeholder="dd/mm/yyyy" data-val-required="Date of Birth is required." data-val="true" autocomplete="off"class="form-control input-sm datepicker" aria-required="true" onkeydown="return false"  />

<script>
        $('.datepicker').datepicker({
            startView: "decade",
            minViewMode: "days",
            format: "dd/mm/yyyy",
            autoclose: true,
            endDate : '0'
        });

    $('#DateOfBirth').change(function ()
    {
        var date = $(this).val();
        if (date != null && date != "")
        {
            var dateArray = date.split('/');
            if (dateArray.length === 3)
            {
                myModel.DateOfBirth(dateArray[2] + "-" + dateArray[1] + "-" + dateArray[0]);
            }
        }
        $(this).valid();  
    }); 

</script>

2 个答案:

答案 0 :(得分:0)

myModel未在任何地方定义。

你可以这样做:

    $('#DateOfBirth').change(function() {
      var date = $(this).val();
      if (date != null && date != "") {
        var dateArray = date.split('/');
        if (dateArray.length === 3) {
          $('#DateOfBirth').val(dateArray[2] + "-" + dateArray[1] + "-" + dateArray[0]);
        }
      }
      $(this).valid();
    });

但是你会再次在输入中看到YYYY-MM-DD格式。因为它在更改时更新,并且每当您选择日期时它都会更改,因此始终会覆盖初始格式。

您可以在此处https://jsfiddle.net/vo7k676n/

进行测试

您可以执行格式更改服务器端或表单提交而不是输入更改。

答案 1 :(得分:0)

我设法使用jquery-ui修复它,

<input type="text" data-bind="value: DateOfBirth" value="" required="" name="DateOfBirth" id="DateOfBirth" placeholder="dd/mm/yyyy" data-val-required="Date of Birth is required." data-val="true" autocomplete="off"class="form-control input-sm datepicker" aria-required="true" onkeydown="return false"  />

<input type="hidden" id="BirthDate" value="" data-bind="value: DateOfBirth" />

<script>
        $(function () {

            $('#DateOfBirth').datepicker({
                format: 'dd/mm/yyyy',
                altField: "#BirthDate",
                altFormat: "yy-mm-dd"
            });

        $('#DateOfBirth').change(function () {
            var date = $("#BirthDate").val();
            if (date != null && date != "") {
                myModel.DateOfBirth(date);
            }
        });

</script>