web-dev-qa-db-fra.com

Comment obtenir la date sélectionnée à partir de jquery datepicker

J'utilise jquery datepicker pour afficher un agenda.Maintenant, je souhaite obtenir la date sélectionnée par l'utilisateur dans ma variable jquery que j'utiliserai dans mon application, mais je ne parviens pas à obtenir la date .. Voici le code pour datepciker

<div id="datepicker"></div>

et ici j'essaie d'obtenir le code sélectionné ..

$(document).ready(function () {

        $("#datepicker").datepicker({
            onSelect: function (dateText, inst) {
                var date = $(this).val();
                alert(date);
            }
        });

    });

Mais, je ne suis pas en mesure d’obtenir la date ..Veuillez m'aider ..Merci ..

javascriptjquerydatepicker
4
Hansal Mehta

Cela devrait faire l'affaire

$(function() {
    $("#datepicker").datepicker();
    $("#datepicker").on("change",function(){
        var selected = $(this).val();
        alert(selected);
    });
});

Son basique mais voici un jsfiddle avec il alertant la date sélectionnée quand sélectionné

mettre à jour pour changer le format de date

$(function() {
    $( "#datepicker" ).datepicker({ dateFormat: "yy-mm-dd" });
    $("#datepicker").on("change",function(){
        var selected = $(this).val();
        alert(selected);
    });
});

jsfiddle

3ème mise à jour

$(function() {
    $("#datepicker").datepicker({ 
        dateFormat: "yy-mm-dd", 
        onSelect: function(){
        var selected = $(this).val();
        alert(selected);
        }
    });
});

J'ai utilisé un peu plus du balisage natif pour datepicker ui ici essayer ceci et voir si vous obtenez l'alerte comme vous êtes après.

23
akaBase

essaye ça 

$('.selector').datepicker({
   onSelect: function(dateText, inst) { ... }
})

vous avez deux éléments avec la classe .datepicker, le sélecteur ne saura pas quel élément choisir. Donc, vous devrez spécifier le nom de l'entrée que vous essayez d'obtenir la date de

first = $(".datepicker[name=datepicker1]").datepicker('getDate');
second = $(".datepicker[name=datepicker2]").datepicker('getDate');
0
Ferrakkem Bhuiyan

Vous pouvez utiliser l'événement changeDate indiqué ici au lieu de onSelect, puis référence e.date ou e.dates. Voir le JSON ci-dessous.

HTML:

<div id='QA'></div>    
<div id='datepicker'></div>

JS:

<script type="text/javascript">     
    $(function() {
        $('#datepicker').datepicker({
            clearBtn: true,
            todayHighlight: false,
            multidate: true

        }) .on('changeDate', function(e){
            $('#QA').html(JSON.stringify(e));
        });
    });
    /*
    {  
       "type":"changeDate",
       "date":"2015-08-08T07:00:00.000Z",
       "dates":[  
         "2015-08-08T07:00:00.000Z"
       ],
       "timeStamp":1438803681861,
       "jQuery21409071635671425611":true,
       "isTrigger":3,
       "namespace":"",
       "namespace_re":null,
       "target":{  

       },
       "delegateTarget":{  

       },
       "currentTarget":{  

       },
       "handleObj":{  
         "type":"changeDate",
         "origType":"changeDate",
         "guid":52,
         "namespace":""
       }
    }
    */

</script>
0
DanielJRobles

Essayer

$("#datepicker").datepicker({
     onSelect:function(selectedDate)
     {
          alert(selectedDate);
     }
});

OR

$("#datepicker").datepicker({
     onSelect:function (dateText, inst)
     {
          alert(inst);
     }
});
0
Gowri