javascript - jquery bootstrap datepicker click event just firing once - Stack Overflow

admin管理员组

文章数量:1023803

I have the following code (i am using the following bootstrap datepicker : /)

The datepicker must be closed when you click on a day. (not the changedate event because a moth of year can also be changed)

everything works fine for just one time. The function is just firing once.

Also I want to retrieve the date from the datepicker

How can you achieve this

(function () {
    var setDate = $('_Date').val();
    //$('#_datepicker').datepicker('setValue', now);
    $('#_datepicker').datepicker('setValue', setDate);

    $('#_Date').change(function () {
    setDate = $('#_Date').val();
    $('#_datepicker').datepicker('setValue', setDate);
    console.log('day2');
});

})(jQuery)

$(function () {
    $('.datepicker-days td.day').click(function (e) {
        e.preventDefault();
        console.log('day');
        //$('#_datepicker').datepicker('hide');

        //alert($('#_datepicker').getDate());

        //return false;
    });
});

HTML / ASPX:

<div class="col-sm-2" runat="server" id="block_date">
  <div class="input-group input-append date" id="datepicker_addcase" data-date="12-02-2012" data-date-format="dd-mm-yyyy">  
  <asp:TextBox runat="server" ID="cn_Date" CssClass="form-control" type="date-local" placeholder="Date" Text="Date"></asp:TextBox>
                                    <div class="input-group-addon">
                                        <span class="glyphicon glyphicon-calendar add-on"></span>
                                    </div>
                                </div>
                            </div>

I have the following code (i am using the following bootstrap datepicker : http://www.eyecon.ro/bootstrap-datepicker/)

The datepicker must be closed when you click on a day. (not the changedate event because a moth of year can also be changed)

everything works fine for just one time. The function is just firing once.

Also I want to retrieve the date from the datepicker

How can you achieve this

(function () {
    var setDate = $('_Date').val();
    //$('#_datepicker').datepicker('setValue', now);
    $('#_datepicker').datepicker('setValue', setDate);

    $('#_Date').change(function () {
    setDate = $('#_Date').val();
    $('#_datepicker').datepicker('setValue', setDate);
    console.log('day2');
});

})(jQuery)

$(function () {
    $('.datepicker-days td.day').click(function (e) {
        e.preventDefault();
        console.log('day');
        //$('#_datepicker').datepicker('hide');

        //alert($('#_datepicker').getDate());

        //return false;
    });
});

HTML / ASPX:

<div class="col-sm-2" runat="server" id="block_date">
  <div class="input-group input-append date" id="datepicker_addcase" data-date="12-02-2012" data-date-format="dd-mm-yyyy">  
  <asp:TextBox runat="server" ID="cn_Date" CssClass="form-control" type="date-local" placeholder="Date" Text="Date"></asp:TextBox>
                                    <div class="input-group-addon">
                                        <span class="glyphicon glyphicon-calendar add-on"></span>
                                    </div>
                                </div>
                            </div>

• javascript
• jquery
• asp
• twitter-bootstrap
• datepicker

Share Improve this question Follow asked Jan 22, 2015 at 10:25 kishen Biekhramkishen Biekhram 6311 silver badge66 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 3

 $('.datepicker-days').on('click', 'td.day', function (e) {
        e.preventDefault();
        $('#datepicker_addcase').datepicker('hide');
        return false;
    });

remove first b.stopPropagation() in "bootstrap-datepicker,min.js" and try:

$(document).on('click','td.day:not(\'.disabled\'):not(\'.active\')',function(e){

// MY LOGIC    

});

I have the following code (i am using the following bootstrap datepicker : /)

The datepicker must be closed when you click on a day. (not the changedate event because a moth of year can also be changed)

everything works fine for just one time. The function is just firing once.

Also I want to retrieve the date from the datepicker

How can you achieve this

(function () {
    var setDate = $('_Date').val();
    //$('#_datepicker').datepicker('setValue', now);
    $('#_datepicker').datepicker('setValue', setDate);

    $('#_Date').change(function () {
    setDate = $('#_Date').val();
    $('#_datepicker').datepicker('setValue', setDate);
    console.log('day2');
});

})(jQuery)

$(function () {
    $('.datepicker-days td.day').click(function (e) {
        e.preventDefault();
        console.log('day');
        //$('#_datepicker').datepicker('hide');

        //alert($('#_datepicker').getDate());

        //return false;
    });
});

HTML / ASPX:

<div class="col-sm-2" runat="server" id="block_date">
  <div class="input-group input-append date" id="datepicker_addcase" data-date="12-02-2012" data-date-format="dd-mm-yyyy">  
  <asp:TextBox runat="server" ID="cn_Date" CssClass="form-control" type="date-local" placeholder="Date" Text="Date"></asp:TextBox>
                                    <div class="input-group-addon">
                                        <span class="glyphicon glyphicon-calendar add-on"></span>
                                    </div>
                                </div>
                            </div>

I have the following code (i am using the following bootstrap datepicker : http://www.eyecon.ro/bootstrap-datepicker/)

The datepicker must be closed when you click on a day. (not the changedate event because a moth of year can also be changed)

everything works fine for just one time. The function is just firing once.

Also I want to retrieve the date from the datepicker

How can you achieve this

(function () {
    var setDate = $('_Date').val();
    //$('#_datepicker').datepicker('setValue', now);
    $('#_datepicker').datepicker('setValue', setDate);

    $('#_Date').change(function () {
    setDate = $('#_Date').val();
    $('#_datepicker').datepicker('setValue', setDate);
    console.log('day2');
});

})(jQuery)

$(function () {
    $('.datepicker-days td.day').click(function (e) {
        e.preventDefault();
        console.log('day');
        //$('#_datepicker').datepicker('hide');

        //alert($('#_datepicker').getDate());

        //return false;
    });
});

HTML / ASPX:

<div class="col-sm-2" runat="server" id="block_date">
  <div class="input-group input-append date" id="datepicker_addcase" data-date="12-02-2012" data-date-format="dd-mm-yyyy">  
  <asp:TextBox runat="server" ID="cn_Date" CssClass="form-control" type="date-local" placeholder="Date" Text="Date"></asp:TextBox>
                                    <div class="input-group-addon">
                                        <span class="glyphicon glyphicon-calendar add-on"></span>
                                    </div>
                                </div>
                            </div>

• javascript
• jquery
• asp
• twitter-bootstrap
• datepicker

Share Improve this question Follow asked Jan 22, 2015 at 10:25 kishen Biekhramkishen Biekhram 6311 silver badge66 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 3

 $('.datepicker-days').on('click', 'td.day', function (e) {
        e.preventDefault();
        $('#datepicker_addcase').datepicker('hide');
        return false;
    });

remove first b.stopPropagation() in "bootstrap-datepicker,min.js" and try:

$(document).on('click','td.day:not(\'.disabled\'):not(\'.active\')',function(e){

// MY LOGIC    

});

本文标签： javascriptjquery bootstrap datepicker click event just firing onceStack Overflow