jquery datepicker에서 날짜를 선택한 후 jquery 대화 상자를 닫습니다.

Question

제 질문은 jquery 대화 상자가 있습니다. 내부 대화 상자 입력 상자를 채우는 및 날짜를 ​​선택하는 옵션이있는 datepicker 초기화 후 완료 단추.

나는 날짜를 선택하고 마침을 클릭하면 대화 상자가 날짜 선택 도구로 닫혀 야합니다.

<script> 
$(document).ready(function() { 
    $('body').on('click','[id^="trnids"]',function(){ 
    vartrnnum = $(this).text(); 
    vartrnname = $(this).closest('#alstn > tr').find('.clstrnname').text(); 

    document.getElementById('divnewdate').innerHTML = ("<input id='ipnewdoj'>"); 

    fulldate1 = fulldate; 
    datearray1 = fulldate1.split("-"); //storing dd,mm,yy seperated by "-" or "/" 
    vardoj1 = datearray1[2] + datearray1[1] + datearray1[0]; //joining yyyymmdd 

    document.getElementById("ipnewdoj").value = vardoj1; 

$(function() { 
    $('#ipnewdoj').datepicker({ 
    onSelect: function(date) { 
       vardoj1 = date; 
     }, 
    dateFormat: 'yymmdd', //you can modify this - in lower case dd-mm-yy 
    numberOfMonths: 1, 
    showButtonPanel: true, 
    showWeek: true, 
    firstDay: 1, 
    changeMonth: true, 
    changeYear: true, 
    showAnim: 'fold', //show; slideDown; fadeIN; blind; bounce, drop; fold; clip; 
    minDate: '-4D', //min days calender will go back. use '-12D' for days, '-12W' for weeks, '-12M' for months, or '-12Y' for years. 
    maxDate: '0D', //max days calender will go next. use '+12D' for days, '+12W' for weeks, '+12M' for months, or '+12Y' for years. 
    }).val(); 
}); 

    $(function() { 
    $("#divnewdate").dialog({ 
    width: 250, 
    height: 270, 
    modal: true, 
    dialogClass:'datagrid', 
    show: {effect: "clip", duration: 1000}, 
    hide: {effect: "drop", duration: 200}, 
    close: function(event, ui) { 
      fnltrs();//write your function here or call function here 
    }//dialog box close option end 
    }); // dialog } close 
}); // dialog function } close 


    }); //main click event close fn 
}); // document ready fn close 

</script> 

모든 도움을 주실 수 있습니다.

Answer 1

아래 코드를 시도해보십시오.

$(document).ready(function() { 
    $('body').on('click','[id^="trnids"]',function(){ 
    vartrnnum = $(this).text(); 
    vartrnname = $(this).closest('#alstn > tr').find('.clstrnname').text(); 

    document.getElementById('divnewdate').innerHTML = ("<input id='ipnewdoj'>"); 

    fulldate1 = fulldate; 
    datearray1 = fulldate1.split("-"); //storing dd,mm,yy seperated by "-" or "/" 
    vardoj1 = datearray1[2] + datearray1[1] + datearray1[0]; //joining yyyymmdd 

    document.getElementById("ipnewdoj").value = vardoj1; 

$(function() { 
    $('#ipnewdoj').datepicker({ 
    onSelect: function(date) { 
       vardoj1 = date; 
    }, 
    onClose: function() {    // Note this additional function here 
     $('#divnewdate').dialog('close'); 
    }, 
    dateFormat: 'yymmdd', //you can modify this - in lower case dd-mm-yy 
    numberOfMonths: 1, 
    showButtonPanel: true, 
    showWeek: true, 
    firstDay: 1, 
    changeMonth: true, 
    changeYear: true, 
    showAnim: 'fold', //show; slideDown; fadeIN; blind; bounce, drop; fold; clip; 
    minDate: '-4D', //min days calender will go back. use '-12D' for days, '-12W' for weeks, '-12M' for months, or '-12Y' for years. 
    maxDate: '0D', //max days calender will go next. use '+12D' for days, '+12W' for weeks, '+12M' for months, or '+12Y' for years. 
    }).val(); 
}); 

    $(function() { 
    $("#divnewdate").dialog({ 
    width: 250, 
    height: 270, 
    modal: true, 
    dialogClass:'datagrid', 
    show: {effect: "clip", duration: 1000}, 
    hide: {effect: "drop", duration: 200}, 
    close: function(event, ui) { 
      fnltrs();//write your function here or call function here 
    }//dialog box close option end 
    }); // dialog } close 
}); // dialog function } close 


    }); //main click event close fn 
}); // document ready fn close 

이 코드는 날짜 선택 도구가 닫힐 때마다 대화 상자도 닫을 것임을 확인합니다.