Bootstrap datepicker trigger change

妖精的绣舞 提交于 2021-02-09 07:11:26

问题


I have from and to input fields with bootstrap date picker. When query params not empty I would like to change the value of these input fields and trigger the change date event on datepicker because I have a function that calculates total price between dates. When user selects dates from datepicker works fine but if I change the value by jquery it does not calculate.

$('#from').val('<%= @from_date %>').trigger( 'change' );
$('#to').val('<%= @to_date %>').trigger( 'change' );
//function
var dates_avail = new DatesAvailability({
                start: '#from',
                end: '#to'
});

..
W.DatesAvailability = function (opts) {
var options = $.extend({}, defaultOpts, opts);
        var start = options.start + ',' + options.rel_start;
        var end = options.end + ',' + options.rel_end;
        $(start + ',' + end).datepicker({
            autoclose: true,
            format: "yyyy-mm-dd",
            startDate: '+1d',
            endDate: '+3y',
..
}).
on('changeDate', function (e) {
// I would like to trigger this.
..

I also have these lines in bootstrap-datepicker.js

..
if (fromArgs){
                // setting date by clicking
                this.setValue();
                this.element.change();
            }
            else if (this.dates.length){
                // setting date by typing
                if (String(oldDates) !== String(this.dates) && fromArgs) {
                    this._trigger('changeDate');
                    this.element.change();
                }
            }
..

回答1:


Try using the update mention in the documentation. Something like `$(start + ',' + end).datepicker('update', qParamStart);

If you're trying to figure out how to get the query params this is a good reference.




回答2:


You can do this by manually calling the event changeDate . E.g. $('.datepicker').datepicker().trigger('changeDate');




回答3:


Inspect the link from the calendar then call it conventionally. For me it was:

$('.ui-state-active').click();

or

$('.ui-datepicker-current-day').click();


来源:https://stackoverflow.com/questions/45175100/bootstrap-datepicker-trigger-change

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!