jQuery Datepicker close datepicker after selected date

后端 未结 5 1978
难免孤独
难免孤独 2020-12-24 01:34

HTML:

5条回答
  •  天涯浪人
    2020-12-24 02:20

    actually you don't need to replace this all....

    there are 2 ways to do this. One is to use autoclose property, the other (alternativ) way is to use the on change property thats fired by the input when selecting a Date.

    HTML

    jQuery

    $(document).ready(function () {
        $('#example1').datepicker({
            format: "dd/mm/yyyy",
            autoclose: true
        });
    
        //Alternativ way
        $('#example2').datepicker({
          format: "dd/mm/yyyy"
        }).on('change', function(){
            $('.datepicker').hide();
        });
    
    });
    

    this is all you have to do :)

    HERE IS A FIDDLE to see whats happening.

    Fiddleupdate on 13 of July 2016: CDN wasnt present anymore

    According to your EDIT:

    $('#example1').datepicker().on('changeDate', function (ev) {
        $('#example1').Close();
    });
    

    Here you take the Input (that has no Close-Function) and create a Datepicker-Element. If the element changes you want to close it but you still try to close the Input (That has no close-function).

    Binding a mouseup event to the document state may not be the best idea because you will fire all containing scripts on each click!

    Thats it :)

    EDIT: August 2017 (Added a StackOverFlowFiddle aka Snippet. Same as in Top of Post)

    $(document).ready(function () {
        $('#example1').datepicker({
            format: "dd/mm/yyyy",
            autoclose: true
        });
    
        //Alternativ way
        $('#example2').datepicker({
          format: "dd/mm/yyyy"
        }).on('change', function(){
            $('.datepicker').hide();
        });
    });
    .hero-unit{
      float: left;
      width: 210px;
      margin-right: 25px;
    }
    .hero-unit input{
      width: 100%;
    }
    
    
    

    EDIT: December 2018 Obviously Bootstrap-Datepicker doesnt work with jQuery 3.x see this to fix

提交回复
热议问题