Tendré un selector de fecha en una página de formulario usando un selector de fecha (arranque de calendario)
Ahora, cuando hace clic en el botón de clic, se abre y puede seleccionar una fecha.
Pero necesito tener la fecha actual en lugar de la inscripción de clic al cargar la página. ¿Cómo puedo hacer eso?
Necesito que esté exactamente seleccionado, como si hiciéramos clic en la fecha de hoy. Porque dentro del calendario habrá otra función que funciona cuando se selecciona una fecha
Intenté instalar "setDate", new Date() y otras respuestas de este hilo bootstrap datepicker hoy como predeterminado , pero nada funcionó para mí ...
let restaurantReserve = { init: function() { let _self = this; $('#reservation-date').datepicker({ startDate: '+0d' }).on('changeDate', function(e) { const arDate = e.date.toString().split(' '); let input = $('[name="RestaurantReservationForm[date]"]'); input.val(arDate[3] + '-' + (e.date.getMonth() + 1) + '-' + arDate[2]); _self.unSetError(input); $('#reservation-date .js-value').text(arDate[2] + ' ' + arDate[1]); }); }, setError: function(ob) { $('#' + ob.data('btnId')).addClass('btn-error'); }, unSetError: function(ob) { $('#' + ob.data('btnId')).removeClass('btn-error'); } } restaurantReserve.init(); .btn { border: none; border-radius: 8px; padding: 10px 15px; font-weight: 800; font-size: 14px; cursor: pointer; } .btn-fourth { text-decoration: none; background: #e3e5e8; color: #747b8b; } <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/css/bootstrap-datepicker.min.css" rel="stylesheet"> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js"></script> <a class="btn btn-fourth " id="reservation-date" data-date=">"> <span class="icon br-calender"></span> <span class="js-value">click</span> </a>Nota: el valor en
.datepicker('setValue', value)debe tener el mismo formato que el de la opción deformatdatepicker. P.ej. 26 abr en tu caso
let restaurantReserve = { init: function() { let _self = this; let today = new Date().toLocaleString('en-us',{day:'numeric', month:'short'}).split(' ').reverse().join(' '); // eg. Apr 26 $('#reservation-date').datepicker({ startDate: '+0d' }).on('changeDate', function(e) { const arDate = e.date.toString().split(' '); let input = $('[name="RestaurantReservationForm[date]"]'); input.val(arDate[3] + '-' + (e.date.getMonth() + 1) + '-' + arDate[2]); _self.unSetError(input); $('#reservation-date .js-value').text(arDate[2] + ' ' + arDate[1]); }); $("#reservation-date").datepicker("setDate", today); }, setError: function(ob) { $('#' + ob.data('btnId')).addClass('btn-error'); }, unSetError: function(ob) { $('#' + ob.data('btnId')).removeClass('btn-error'); } } restaurantReserve.init(); .btn { border: none; border-radius: 8px; padding: 10px 15px; font-weight: 800; font-size: 14px; cursor: pointer; } .btn-fourth { text-decoration: none; background: #e3e5e8; color: #747b8b; } <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/css/bootstrap-datepicker.min.css" rel="stylesheet"> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js"></script> <a class="btn btn-fourth " id="reservation-date" data-date=">"> <span class="icon br-calender"></span> <span class="js-value">click</span> </a>