По наивности попробовал загрузить файлы на сервер, используя JQuery-команду post:
$.post(url, $("#myForm").serialize());
HTML-код формы, скажем такой:
<form id="myForm">
<input type="text" name="text"/>
<input type="file" name="image"/>
</form>
Оказалось через AJAX так делать нельзя, если в форме есть файлы :) Как же тогда сделать? Одно из решений - плагин "forms" к jQuery. В коде страницы пишем следующее:
script type="text/javascript" src="/media/js/jquery.form.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// bind 'myForm' and provide a simple callback function
$('#myForm').ajaxForm();
// submit form
$("#myForm").ajaxSubmit({
url: url,
iframe: true,
dataType: 'json',
beforeSubmit: function(arr, $form, options) {
// some code here
},
success: function(data) {
// some code here
}
});
})
, где параметр iframe: true рекомендую установить, если идет загрузка файлов. Параметр dataType: 'json' - задает тип возвращаемых данных.
Попробовал работу плагина в Firefox 3.6, Chrome 5 и Internet Explorer 8. Работает без проблем. И на последок описание API плагина.
| alerion - 04.09.2010 |
Плагин действительно хороший. И без "iframe: true", вроде как работает. |
| Толик Востряков - 04.09.2010 |
Не пробовал без iftame: true. Решил довериться рекомендации. |
| pashsha - 04.10.2011 |
Гуд, спасибо, пригодилось! Проверено, работает. |
| Толик Востряков - 04.10.2011 |
Отлично, что помогло! |
| George Mihailov - 13.12.2011 |
Есть опыт использования этой библиотеки. В целом работает хорошо. Однако при cross domain запросах работать не будет, придётся прикручивать cross frame messaging. |
| Evgeny - 28.01.2012 |
Отличная вещица в будущем думаю пригодится. |
| maxambek - 22.03.2012 |
Нифига не работает :( Скопировал один к одному пример (добавил только в конце) |
| maxambek - 22.03.2012 |
Ёлки-палки - куда-то пропал закрывающий тэг скрипта в моём сообщении. Вобщем я его в примере добавил - всё равно не работает |
| Толик Востряков - 22.03.2012 |
Вместо url - естественно твой url. Плюс нужна конечно серверная часть к этому примеру. Потом смотреть - что доходит до сервера. На что ругается браузер при отправке. |
| maxambek - 22.03.2012 |
URL я свой написал, это понятно. Серверная часть до безобразия простая: def doajaxfileupload(request): print u'вошли' mimetype='text/javascript' data=simplejson.dumps({'txt':u'Загрузили'}) print u'отработали' return HttpResponse(data, mimetype) Реакция браузера: при загрузке страницы в консоли выводятся строки: вошли отработали На дальнейшее действие никакой реакции. Это в ФФ, а в ИЕ ответ сервера пытается сохранить в файл |
| maxambek - 22.03.2012 |
Кстати в примере нет кнопки отправки данных - я добавил |
| maxambek - 23.03.2012 |
разобрался - заработало. Получилось через ajaxForm, без использования ajaxSubmit |