2012-01-04 3 views
0

Я пытаюсь прикрепить JQuery datepicker к текстовому полю формы, но я не уверен, как использовать значки, которые поставляются с загрузкой JQuery.Rails 3.1 JQuery Icons

У меня есть все таблицы стилей в папке app/assets/stylesheets, и есть подпапка, называемая изображениями, которые я также поместил в папку stylesheets. Я видел другое сообщение StackOverflow, в котором говорилось, что я не должен помещать эти изображения в свою папку app/assets/images.

Тогда в моем .coffee файле у меня есть

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

Проблема заключается в том, что у меня нет файла с именем calendar.gif. Я видел много примеров для 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. Вам нужно будет создать или найти значок календаря.

1

Это, как я загрузить мой DatePicker:

_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 (мой заказ Javascript)

$ -> 
    # 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/ бесплатно.