Rails нажмите на div, чтобы загрузить изображение - PullRequest
Новая
       1

Rails нажмите на div, чтобы загрузить изображение

2 голосов
/ 11 августа 2011 
    <div id="photo_attachment_container">
        <%= f.file_field :photo %>
    </div>

В настоящее время моя стандартная кнопка загрузки изображений выглядит в рельсах.Я хотел бы улучшить его эстетически, используя div на странице с фоновым изображением в качестве заполнителя, и люди могут щелкнуть этот div для загрузки изображения (функция, предоставляемая в данный момент кнопкой), и когда изображение загружено, оно становитсяфон div.

Также скрепка обрабатывает загрузку и может изменить размер до размера div.

Как я могу сделать что-то подобное в рельсах?Спасибо

enter image description here

1 Ответ

0 голосов
/ 18 августа 2011

Если вы хотите отобразить запрос на просмотр файла, вы должны использовать ввод файла формы.

Что вы можете сделать, это расположить ввод файла абсолютно внутри div и отслеживать мышь вокруг div при его перемещении,Таким образом, где бы мышь ни щелкала по элементу div, ввод файла будет происходить под мышкой и отображать приглашение браузера.

Затем можно скрыть ввод файла, используя непрозрачность 0.

Очевидно, этометод требует javascript.

Затем вы можете применить слушатель onchange к входному файлу, чтобы при выборе файла он отправлял форму скрытому фрейму.Сервер загружает изображение в iframe, а затем печатает что-то вроде 

window.top.returnFileUrl('new-file-name.jpg');

Если эта функция определена в родительском окне .... 

function returnFileUrl(url)
{
    document.getElementById('image-div').style.background = 'url('+url+')';
}

Это непроверенный код для указанияВы в правильном направлении.

...