Как я могу добавить поле ‹select› к моей форме загрузки?

Я слежу за этим сообщением в блоге http://blog.notdot.net/2010/04/Implementing-a-dropbox-service-with-the-Blobstore-API-part-3-Multiple-upload-support где подробно описано, как использовать plupload с google appengine и api blobstore. Мне интересно, как добавить настраиваемое поле в загрузку. Я изменил тип enc на multipart / form-data

<form method="POST" enctype="multipart/form-data">
    <select id="adventure" name="adventure">
        <option value = "collection-A">Collection A</option>
        <option value = "collection-A">Collection B</option>
    </select>


    <div id="html5_uploader">
        <p>You browser doesn't have Flash, Silverlight, Gears, BrowserPlus or HTML5 support.</p>
    </div>
</form>

Прочитав о том, что multipart не работает в документах с браузерами webkit (я использую chrome), я решил использовать версию на основе flash, а не html5, с которой я начал. Используя различные примеры и обсуждения на этом форуме, я собрал следующее.

<script type="text/javascript">
 $(function() {
    uploader = $("#html5_uploader").pluploadQueue({
        // General settings
        runtimes : 'html5',
        max_file_size : '10mb',
        chunk_size : '1mb',
        multipart : true,
        unique_names : true,
         // Flash settings
        flash_swf_url : '/static/plupload/plupload.flash.swf'
    }).pluploadQueue();
    uploader.bind('BeforeUpload', function (up, file) 
    {
        $.extend(up.settings.multipart_params, {
        'adventure': $('#adventure').val()
        });
    });
    uploader.bind('UploadFile', function(up, file) {
        $.ajax({
            url: '/generate_upload_url',
            async: false,
            success: function(data) {
              up.settings.url = data;
            },
        });
    });
})
</script>

На стороне загрузки файлов все работает, однако параметры полей выбора не отправляются и:

self.request.get("adventure")

ничего не подбирает на стороне сервера. Я использую самую последнюю версию plupload (а не измененную версию Ника).


javascript jquery google-app-engine jquery-plugins plupload
person user714852    schedule 13.02.2012    source источник
comment
Форма отправляется?   -  person Laur Ivan    schedule 14.02.2012
comment
Данные (файл) попадают на сервер и успешно сохраняются - в этом смысле да, форма отправляется. Однако дополнительный атрибут adventure не представлен.   -  person user714852    schedule 14.02.2012
comment
afaik вызов ajax / flash эквивалентен возврату false при отправке формы. Другими словами, JS генерирует собственный запрос POST для загрузки данных, но форма, хранящаяся в вашем HTML, ничего не генерирует. ИМО, вам нужно добавить дополнительное значение в качестве параметра GET к отправленному URL-адресу   -  person Laur Ivan    schedule 14.02.2012
comment
Я понял, что то, что я делаю с самой формой, на самом деле не имеет никакого эффекта. Я прочитал api docs ‹plupload .com / plupload / docs / api / ›но я просто не могу найти ничего, что могло бы помочь. Я не понимаю, как реализовать ваше предложение: дополнительное значение в качестве параметра GET для вашего отправленного URL-адреса - я думал, что это то, что я делал, используя $ .extend ()   -  person user714852    schedule 15.02.2012
comment
Я не уверен, как работает plupload, но похоже, что вы загружаете по определенному URL-адресу. Вы можете попробовать добавить параметры к URL-адресу (?param=value), но при необходимости их нужно избегать. По сути, вместо того, чтобы отправлять http://some.url/for/upload, вы отправляете http://some.url/for/upload?param=value. Возможно, вы сможете сделать это через api plupload ...   -  person Laur Ivan    schedule 15.02.2012

Ответы (2)


arrow_upward
5
arrow_downward

Итак, после некоторой борьбы с этим я вернулся к версии html5 и вместо использования BeforeUpload теперь "жестко запрограммировал" значение в, но это работает для моей реализации ..

var adventure_name = $('#adventure').val();
$('#adventure').change(function(){
    adventure_name = $('#adventure').val();
});
// Setup html5 version
 $(function() {
    uploader = $("#html5_uploader").pluploadQueue({
        // General settings
        runtimes : 'html5',
        max_file_size : '10mb',
        url : '{{ upload_url }}',
        multipart : true,
        multipart_params : {'adventure': adventure_name},
        unique_names : true,
         // Flash settings
    }).pluploadQueue();
    uploader.bind('UploadFile', function(up, file) 
    {
        $.ajax({
            url: '/generate_upload_url',
            async: false,
            success: function(data) {
              up.settings.url = data;
            },
        });
    });
});
person user714852    schedule 14.02.2012

arrow_upward
5
arrow_downward

Я думаю, что это проблема: up.settings.multipart_params === undefined при запуске этого кода:

$.extend(up.settings.multipart_params, {
    'adventure': $('#adventure').val()
});
person tgf    schedule 27.11.2012