2012-01-04 4 views
0

양식의 텍스트 필드에 JQuery 날짜 표시기를 연결하려고하지만 JQuery 다운로드와 함께 제공되는 아이콘을 사용하는 방법을 모르겠습니다.레일 3.1 JQuery 아이콘

내 app/assets/stylesheets 폴더에 모든 스타일 시트가 있으며 스타일 시트 폴더에 넣은 이미지라는 하위 폴더가 있습니다. 그 이미지를 내 app/assets/images 폴더에 넣지 말아야한다는 다른 StackOverflow 게시물을 보았습니다.

그런 다음 내 .coffee 파일에 나는 문제는 내가 calendar.gif라는 파일이없는 것입니다

$ -> $('.datepicker').datepicker({ 
    buttonImageOnly : true, 
    buttonImage : "calendar.gif", 
    showOn : "button" 
    }) 

있습니다. buttonImage에 대한 예제를 많이 보았고 그 중 아무 것도 가지고 있지 않은 참조 파일을 보았습니다. 내가 갖고있는 몇 가지 .png 파일은 테마의 모든 아이콘을 포함하고있는 것 같습니다. 내가 다운로드해야하는 다른 파일이 있거나 큰 .png 파일을 잘못된 위치에 넣고 있습니까?

buttonImage에 대해 여러 가지 값을 시도해 보았습니다. 모두 나열하지 않아도됩니다. 여기 제가 시도한 것들이 있습니다 : ui-icon-calendar images /ui-icon-calculator.png images/.ui-icon-calculator.png images/ui-icon-calculator 도움말은 다음과 같습니다. 대단히 감사합니다.

답변

0

나는 당신이 아이콘 트리거와 함께 datepicker 필드를 사용하는 것에 대해 질문하고 있다고 생각합니다. 이 변형은이 페이지에서 설명됩니다 : http://jqueryui.com/demos/datepicker/#icon-trigger

이 경우 아이콘 이미지가 jQuery UI에 포함 된 자산이 아닌 것 같습니다. 일정 아이콘을 만들거나 찾아야합니다.

1

이것은 내가 내 날짜 선택기를로드하는 방법입니다

_form.html.haml을

.row 
    .span16 
    = normal_div_if @purchase_order.errors[:date].empty? do 
     = f.label :date, "Date, class: "compulsory" 
     .input 
     - if @purchase_order.new_record? 
      = f.text_field :date, id: "datepicker", class: "small" 
     - else 
      = f.text_field :date, id: "datepicker", class: "small", value: l(@purchase_order.date) 

global.js.coffee.erb (내 사용자 지정 자바 스크립트)

$ -> 
    # Initiate date picker 
    $("#datepicker").datepicker({dateFormat: "dd-mm-yy", changeMonth: true, changeYear: true, showOn: "button", buttonImage: "<%= asset_path('calendar.png') %>", buttonImageOnly: true}); 

내 캘린더 이미지는 assets/images/calendar.png

에 있습니다.

http://www.famfamfam.com/lab/icons/silk/에서 무료 캘린더 이미지를 얻을 수 있습니다.