web-dev-qa-db-fra.com

définir la date dans le type d'entrée date

<input id="datePicker" type="date" />​

je vais définir la date du jour dans l’entrée Datepicker , tapez la date en chrome.

$(document).ready( function() {
    var now = new Date();
    var today = now.getDate()  + '/' + (now.getMonth() + 1) + '/' + now.getFullYear();
    alert(today);
    $('#datePicker').val(today);
});​

mais ça ne marche pas

Edit This jsFiddle - S'il vous plaît essayez en chrome.

jqueryhtml5date
81
Sender

Lien Fiddle: http://jsfiddle.net/7LXPq/93/

Deux problèmes en cela:

  1. Le contrôle de date en HTML 5 accepte au format Année - Mois - Jour comme nous l’utilisons dans SQL
  2. Si le mois est 9, il doit être défini sur 09 et non sur 9. Donc, cela s'applique également au champ de jour.

Veuillez suivre le lien de violon pour la démo:

var now = new Date();

var day = ("0" + now.getDate()).slice(-2);
var month = ("0" + (now.getMonth() + 1)).slice(-2);

var today = now.getFullYear()+"-"+(month)+"-"+(day) ;

$('#datePicker').val(today);
134
Dhanasekar

document.getElementById("datePicker").valueAsDate = new Date()

devrait marcher.

98
int32_t

Mise à jour: je fais cela avec date.toISOString().substr(0, 10). Donne le même résultat que la réponse acceptée et bénéficie d'un bon soutien.

19
Oliv Utilo

pour moi, le moyen le plus rapide de résoudre ce problème consiste à utiliser moment.js et à résoudre ce problème en seulement 2 lignes.

var today = moment().format('YYYY-MM-DD');
$('#datePicker').val(today);
11
Umair Khalid
var today = new Date().toISOString().split('T')[0];
$("#datePicker").val(today);

Le code ci-dessus fonctionnera.

8
Gourav Makhija

Votre code aurait fonctionné s'il avait été dans ce format: YYYY-MM-DD, il s'agit du standard informatique pour les formats de date http://en.wikipedia.org/wiki/ISO_8601

4
Dominic

Je crée généralement ces deux fonctions d'assistance lorsque j'utilise des entrées de date:

// date is expected to be a date object (e.g., new Date())
const dateToInput = date =>
  `${date.getFullYear()
  }-${('0' + (date.getMonth() + 1)).slice(-2)
  }-${('0' + date.getDate()).slice(-2)
  }`;

// str is expected in yyyy-mm-dd format (e.g., "2017-03-14")
const inputToDate = str => new Date(str.split('-'));

Vous pouvez ensuite définir la valeur d'entrée de la date comme suit:

$('#datePicker').val(dateToInput(new Date()));

Et récupérer la valeur sélectionnée comme si

const dateVal = inputToDate($('#datePicker').val())
1
aashah7

Datetimepicker a toujours besoin du format d'entrée AAAA-MM-JJ. Peu importe le format d'affichage de votre modèle ou votre date/heure système locale. Mais le format de sortie du sélecteur de date/heure est celui que vous souhaitez (votre système local). Il y a un exemple simple dans mon post .

0
Eda Jede