Получение средства выбора даты Bootstrap для отображения в виде строки, но в формате yyyy-mm-dddd

avatar
DiamondJoe12
8 августа 2021 в 17:53
92
1
1

Я пытаюсь заставить средство выбора даты Bootstrap отображать в строковом формате, т.е. August 8, 2021 (т.е. в строке ввода). Но я хочу, чтобы фактические значения дат были отформатированы yyyy-mm-dd.

HTML:

<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/css/bootstrap-datepicker.min.css" rel="stylesheet"/>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/js/bootstrap-datepicker.min.js"></script>

<style type="text/css">
        .datepicker {
            font-size: 0.875em;
        }
        /* solution 2: the original datepicker use 20px so replace with the following:*/
        
        .datepicker td, .datepicker th {
            width: 1.5em;
            height: 1.5em;
        }
        
    </style>

 <input style= "font-size:14px"id="datepicker"> 

Javascript:

$('#datepicker').datepicker({

    weekStart: 1,
    autoclose: true,
    format: 'yyyy-mm-dd',
    startDate: new Date(),
    Readonly: true,

});

$('#datepicker').datepicker("setDate", new Date());

$(function() {
$("#datepicker").datepicker();

$("#datepicker").val();

$("#datepicker").on("change",function(){
    
    selectedDate = $(this).val();
    update(selectedDate)
    console.log("datepicker selectedDate is", selectedDate)
    return selectedDate
});

Как это проще всего сделать?

Источник
Bumhan Yu
8 августа 2021 в 18:39
1

Просмотрите ответы здесь: coderhelper.com/questions/23593052/…

Ответы (1)

avatar
Web Admin
14 августа 2021 в 10:30
0
 <!DOCTYPE html>
<html lang="en">
<head>
    
   <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker.css" rel="stylesheet" type="text/css" />

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.js"></script>

</head>

<body>
    
    <input style= "font-size:14px"id="datepicker"> 

<script type="text/javascript">
      $('#datepicker').datepicker({

        weekStart: 1,
        autoclose: true,
        format: 'yyyy-mm-dd',
        startDate: new Date(),
        Readonly: true,

      });

      $('#datepicker').change(function(){

        var a = $(this).val();
        console.log(a);
      });

    </script>

</body>
</html>

с помощью приведенного выше кода вы можете получить дату в формате гггг/мм/дд. есть некоторая проблема с соответствием вашего js моему коду и исправьте это.