Загрузка изображений AJAX с помощью Rails, Backbone, Remotipart

Некоторое время назад я успешно использовал Remotipart для загрузки изображений через AJAX, но недавно мы решили пойти по пути Backbone, и теперь, поскольку мои формы отображаются с помощью шаблонов JS, я больше не могу использовать:remote => true синтаксис для генерации транспортного кода Iframe. Я не хочу выяснять, как это сделать вручную. Любые мысли о том, как я могу заставить Remotipart работать при использовании шаблонов JS?

1 ответ

Решение

Разобрался с решением. Я был немного смущен тем, как работает JS для Remotipart. После небольшого исследования вот что я нашел:

Remotipart работает просто путем привязки к событию ajax:aborted:file, которое запускается, когда jQuery UJS (который обрабатывает отправку традиционной формы AJAX) обнаруживает файл внутри формы. Поскольку этот скрипт (вместе с зависимым транспортным плагином iFrame) уже включен на страницу, все что вам нужно сделать, это добавить вручную

data-remote="true"

к вашей форме. У jQuery есть событие.on(), связанное с формами с такими атрибутами, поэтому, если вы включите это, Remotipart будет запущен.

Другая проблема, однако, заключается в том, что если эта форма будет отправлена, она все равно не сможет загрузить файл из-за отсутствия токена CSRF. Решение состоит в том, чтобы вручную добавить скрытый тег ввода с токеном.

Вот последняя разметка, которая сработала для меня (я использую шаблоны.eco с небольшим jQuery, чтобы получить значение мета-тегов CSRF на странице):

<form accept-charset="UTF-8" id="image-upload-form" action="/projects/<%= @project.get('id') %>" method="post" enctype="multipart/form-data" data-remote="true">
    <input name="project[cover_photo]" type="file" />
    <input type="hidden" name="<%= $('meta[name="csrf-param"]').attr('content') %>" value="<%= $('meta[name="csrf-token"]').attr('content') %>" />
    <input name="_method" type="hidden" value="put" />
    <button id="add-photo">Save</button>
</form>

Надеюсь, это поможет избавить кого-то еще от той же проблемы, что и у меня!

Другие вопросы по тегам