선택 후 부트스트랩 날짜 선택기 숨기기

선택 후 부트스트랩 날짜 선택기 숨기기

날짜를 선택한 후 달력을 숨기려면 어떻게 해야 합니까?제가 사용할 수 있는 특정 기능이 있습니까?아래 내 코드:

$('#dp1').datepicker({
    format: 'mm-dd-yyyy',
    startDate: '-15d',
    autoclose: true,
    endDate: '+0d' // there's no convenient "right now" notation yet
});

어떤 도움이라도 주시면 감사하겠습니다.

이벤트를 사용할 수 있습니다.changedate()날짜가 함께 변경되는 시기를 기록하기 위해datepicker('hide')숨김 방법datepicker선택한 후:

$('yourpickerid').on('changeDate', function(ev){
    $(this).datepicker('hide');
});

데모

갱신하다

이것이 문제였습니다.autoclose: true이 버그는 최신 마스터에서 수정되었습니다.참조하십시오. 다음에서 최신 코드를 가져옵니다.

누군가에게 도움이 된다면 부트스트랩 날짜 선택기 버전 2.0은 더 이상 승인된 답변과 함께 작동하지 않습니다.

내 것을 어떻게 작동시켰는지는 다음과 같습니다.

$('yourpickerid').datepicker({
    format: 'dd/mm/yyyy',
}).on('changeDate', function(e){
    $(this).datepicker('hide');
});

http://bootstrap-datepicker.readthedocs.org/en/latest/events.html#changedate 을 참조하십시오.

$('#input').datepicker({autoclose:true});

1. 열기만 하면 됩니다.bootstrap-datepicker.js
2. 찾기:var defaults = $.fn.datepicker.defaults
3. 세트autoclose: true

프로젝트를 저장하고 새로 고치면 됩니다.

일반적으로 캘린더의 동작을 전체적으로 재정의하려는 경우 날짜 선택기 기능(내 예에서는 82행)을 편집해 보십시오.

부터

    this.autoclose = false;

로.

    this.autoclose = true;

모든 일정관리 인스턴스가 동일하게 작동하기를 원했기 때문에 잘 작동했습니다.

다음 행으로 입력 요소에 대한 숨기기 이벤트를 차단하여 문제를 중지할 수 있습니다.

var your_options = { ... };
$('.datetimepicker').datetimepicker(your_options).on('hide', function (e) {
    e.preventDefault();
    e.stopPropagation();
});

날짜 선택 시 날짜 선택기 닫기(날짜 선택기 시간 표시)

$('.datepicker').datepicker({
    autoclose: true,
    closeOnDateSelect: true
}); 

부트스트랩 4에서 "autoHide: true"를 사용합니다.

$('#datepicker1').datepicker({
    autoHide: true,
    format: 'mm-yyyy',
    endDate: new Date()
});

$('yourpickerid').datetimepicker({
           pickTime: false
}).on('changeDate', function (e) {
           $(this).datetimepicker('hide');
});

형식 'YYYY-MM-DD'를 작성해도 시계가 계속 표시되지 않아 문제가 있습니다.

설정해야 했습니다.pickTime: false그리고 변화 후 -> 집중해야 했던 숨김 -> 보여주기

$('#VBS_RequiredDeliveryDate').datetimepicker({
  format: 'YYYY-MM-DD',
  pickTime: false
});

$('#VBS_RequiredDeliveryDate').on('change', function(){
    $('.datepicker').hide();
});

$('#VBS_RequiredDeliveryDate').on('focus', function(){
    $('.datepicker').show();
});

완벽한 해결책이 있습니다.

$('#Date_of_Birth').datepicker().on('changeDate', function (e) {
    if(e.viewMode === 'days')
        $(this).blur();
});

$('.datepicker').datepicker({
    autoclose: true
}); 

datetime picker로 변경하고 포맷을 'DD/MM/YYY'로 변경하였습니다.

$("id").datetimepicker({
    format: 'DD/MM/YYYY',
}).on('changeDate', function() {
    $('.datepicker').hide();
});

적어도 내가 사용하고 있는 버전 2.2.3에서는, 당신은autoClose대신에autoclose편지함이 중요합니다.

소스 코드인 bootstrap-datepicker.js를 변경할 수 있습니다. 추가this.hide();같은

  if (this.viewMode !== 0) {
    this.date = new Date(this.viewDate);
    this.element.trigger({
        type: 'changeDate',
        date: this.date,
        viewMode: DPGlobal.modes[this.viewMode].clsName
    });
    this.hide();//here
 }

날짜/시간 선택기

$('yourpickerid').datetimepicker({
        format: 'dd/mm/yyyy',
}).on('changeDate', function(e){
        $(this).datetimepicker('hide');
});

날짜 선택기에 사용합니다. 잘 작동합니다.

$('#Date').data("DateTimePicker").hide();

이것이 언급된 것을 보지 못했지만, 이것이 제가 그것을 고친 이유입니다.

switchOnClick: true

언급URL : https://stackoverflow.com/questions/21151830/bootstrap-datepicker-hide-after-selection