2013-10-07 2 views
2

방금 ​​jQuery Datepicker를 사용하면서 문제가 발생했습니다. 캘린더 아이콘이 보이지만 오른쪽 대신 입력란 아래에 표시됩니다. jQuery 코드에 의해 캘린더 아이콘이 호출되었으므로 인라인으로 표시하려면 어떤 옵션을 사용해야합니까? 여기에 관련 코드가 있습니다. 감사.오른쪽 대신 입력란 아래에 jQuery Datepicker 아이콘이 표시됩니다.

<script> 
$(function() { 
    $("#datepicker").datepicker({ 
     showOn: "button", 
     buttonImage: "calendar_icon.gif", 
     buttonImageOnly: true, 
     buttonText: "Open calendar" 
    }); 
}); 
</script> 
Date: <input type="text" id="datepicker" /> 

답변

1

CSS에 대해 언급하지 않았으므로 문제가있는 부분을 추측합니다. ci 파일에 ui-datepicker-trigger 클래스를 추가해야합니다. 이것은 자동으로 함수에 의해 할당되므로 class = "ui-datepicker-trigger"를 포함하도록 입력을 변경할 필요가 없습니다. 나는 복사하여 내 CSS 파일 중 하나에서 사용하고있는 것을 붙여 넣었습니다. 당신이 필요로하는 부분은 디스플레이 : 인라인 부분입니다.하지만 당신은 모든 것을 사용하게 될 수도 있습니다.

.ui-datepicker-trigger { 
    display: inline; 
    padding:0px; 
    padding-left:3px; 
    vertical-align:baseline; 
    position:relative; 
} 

이 확장을 조금 더 확장하려면 입력 상자 아래에 나타나는 일반적인 CSS 동작이있는 경우 필요합니다.

0

텍스트 상자에 날짜를 표시하기 만하면 위에서 언급 한 코드를 사용할 필요가 없습니다.

<script>$("#datepicker").datepicker();</script> 
    Date: <input type="text" id="datepicker" /> 

날짜 형식을 변경해야하는 경우 다음이

$("#datepicker").datepicker({ dateFormat: "yy-mm-dd" }).val(); 
갈 수
관련 문제