대화 상자에서 jQuery UI DatePicker 열기 열기

Question

jQuery UI datepicker 컨트롤이 포함 된 jQuery UI 대화 상자 창이 표시됩니다. 문제는 대화 상자 창에있는 첫 번째 양식 필드가 datepicker이므로 창이 열리면 포커스를받으며 이로 인해 datepicker 창이 자동으로 열립니다. 나는 이것을 원하지 않는다.

나는 대화 상자의 열기 기능에

$('#Date').datepicker('hide') 

를 호출하고 시도 또한 코드에 도달하면 대화 상자가 열려 있지만 작동하지 않을 수 있습니다 코드의 날짜 선택기 창 ISN 후 아직 열리지 않았다.

대화 상자 창이 나타나도 datepicker 창이 열리지 않지만 사용자가 입력을 클릭 할 때 열어 두도록하려면 어떻게합니까?

Answer 1

당신은 아이콘 트리거 사용할 수 있습니다 http://jqueryui.com/demos/datepicker/#icon-trigger

을 그리고, 필요한 경우, 날짜를 입력에서 사용자를 방지 할 수 있습니다.

나는 datepicker가 포함 된 대화 상자를 만들었으므로 FF 또는 Chrome에서 문제를 복제 할 수 없었습니다. 그것은 IE에서 일어났다. 이전 답변에 따라

$(".datepicker").datepicker({ 
    dateFormat: 'yy-mm-dd ' 
}); 

$(".datepicker").datepicker("disable"); 

$("#dialog").dialog({ 
width: 400, 
modal: true, 
open: function(event, ui) { 
    $(".datepicker").datepicker("enable"); 
    } 
}); 

http://jsfiddle.net/458bM/2/

: 대화 상자가 열려 있지 않은 경우 How to blur the first form input at the dialog opening

Answer 2

대화 상자를 정의 할 때 열려있을 때 포커스를받을 요소를 지정할 수 있습니다. 대화 상자의 다른 요소로 포커스 설정

$('#myDialog').dialog({ 
    open: function (event, ui) 
     { 
      $('#myInputBox').focus(); 
     } 
}); 

열려있는 이벤트 코드에 datepicker를 숨기려면 호출 할 수도 있습니다.

Answer 3

당신은 날짜 선택기를 사용하지 않도록 설정할 수 있습니다.

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

$('#dialog').dialog({ 
    open: function(event, ui) { 
     $('#datepicker').datepicker('enable'); 
    }, 
    close: function(event, ui) { 
     $('#datepicker').datepicker('disable'); 
    }, 
    ... 
}); 

실례 : http://jsfiddle.net/william/Rf37h/1/을 참조하십시오.

Answer 4

는에 자동 초점하려고합니다 그것이 전에 숨겨진 요소를 추가이 한 줄의 코드를

$(document).ready (function() { 
$('#dialog_modal_body').on("click", ".datepicker", function(){ 
     $("#ui-datepicker-div").css("z-index", "100000"); 
}); 
}); 

Answer 5

을보십시오.

이렇게하면 대화 상자를 열 때 datepicker에 집중하지 않게됩니다.

<span class="ui-helper-hidden-accessible"><input type="text"/>Prevents autofocus from opening start datepicker on dialog load</span> 

의