SWFupload - 通过上传从表单传递变量

Question

我指的是这个问题中的 simpledemo http://demo.swfupload.org/v220/ simpledemo/index.php

我希望能够传递由下拉菜单设置的变量。

上传者是由发起者发起的

var swfu;
window.onload = function() {
    var settings = {
        flash_url : "<?php global_data::show_admin_dir(); ?>SWFUpload v2.2.0.1 Samples/demos/swfupload/swfupload.swf",
        upload_url: "<?php global_data::show_admin_dir(); ?>upload.php",
        post_params: {"PHPSESSID" : "<?php echo session_id(); ?>" },
        file_size_limit : "100 MB",
        file_types : "*.*",
        file_types_description : "All Files",
        file_upload_limit : 100,
        file_queue_limit : 0,
        custom_settings : {
            progressTarget : "fsUploadProgress",
            cancelButtonId : "btnCancel"
        },
        debug: false,
                // Button settings
        button_image_url: "images/TestImageNoText_65x29.png",
        button_width: "95",
        button_height: "29",
        button_placeholder_id: "spanButtonPlaceHolder",
        button_text: '<span class="theFont">UPLOAD</span>',
        button_text_style: ".theFont { font-size: 16; }",
        button_text_left_padding: 12,
        button_text_top_padding: 3,

        // The event handler functions are defined in handlers.js
        file_queued_handler : fileQueued,
        file_queue_error_handler : fileQueueError,
        file_dialog_complete_handler : fileDialogComplete,
        upload_start_handler : uploadStart,
        upload_progress_handler : uploadProgress,
        upload_error_handler : uploadError,
        upload_success_handler : uploadSuccess,
        upload_complete_handler : uploadComplete,
        queue_complete_handler : queueComplete  // Queue plugin event
    };

    swfu = new SWFUpload(settings);
 };

，表格如下，

<form id="form1" action="index.php" method="post" enctype="multipart/form-data">
        <p><label>Category: </label><input type="radio" name="for" class="radio" value="category" checked="checked" /><select name="foo"><option>...</option><?php global_data::show_breadcrum_list( 'option', " / " ); ?></select></p>
        <p><label>Product: </label><input type="radio" name="for" class="radio" value="category" /><select disabled="disabled"><option name="foo">...</option><?php global_data::show_breadcrum_list( 'option', " / " ); ?></select></p>    
        <div class="fieldset flash" id="fsUploadProgress">
            <span class="legend">Upload Queue</span>
        </div>
        <div id="divStatus">0 Files Uploaded</div>
        <div>
            <span id="spanButtonPlaceHolder"></span>
            <input id="btnCancel" type="button" value="Cancel All Uploads" onclick="swfu.cancelQueue();" disabled="disabled" style="margin-left: 2px; font-size: 8pt; height: 29px;" />
        </div>
    </form>

如果有人能指出我正确的方向，我将不胜感激。

＃＃＃＃＃＃ 编辑 ＃＃＃＃＃ 我可能找到了一种方法...

使用 post_params: {"PHPSESSID" : "", "PR" : thing }, 在初始化设置中并将其全部包装在一个函数中

function loader( thing ) {
    ....
}

，然后使用

$(document).ready(function(){
    $('select[name=foo]').change(function(){
        loader( $(':selected', this).text() );
    });
});

它就可以了，但是如果我在上传之前第二次更改选择选项，则会出现错误，并且仅发送第一个选择而不是第二个...

Answer 1

我试图做类似的事情，在找到这个解决方案并与我的同事讨论后，我们使用 swfupload 提供的 Javascript API 以另一种方式解决了这个问题。

我们试图在上传视频的同时传递质量设置。最终这个问题的解决方案涉及到如何改变post_params。首先 post_params 将成为下拉列表的默认值：

var selected_quality = $('select#quality-".$dirId." option:selected').val();
...
post_params: {'quality' : selected_quality},

然后，当在下拉列表中选择选项时，您可以使用 addPostParam 方法（位于 swfupload.js 中）来更新此值。

$('select#quality-".$dirId."').change(function () {
  swfu.addPostParam('quality' , this.value);
});

Answer 2

我用两种方式解决了这个问题（都使用jquery）：cookies和mysql。这个概念是这样

$('select[name=foo]').change(function(){
   $.cookie('dropdown', $(this).val());
});

的，当你改变下拉菜单时，你现在就有了一个cookie。然后，您可以在 upload.php 中调用该 cookie 并将其用作变量。

另一个选项是

$('select[name=foo]').change(function(){
   $.post('updatedatabase.php', {'dropdown': $(this).val()});
});

然后您从 upload.php 调用数据库以获取下拉列表的最后一个值。这两种方式都不是很优雅，但我以前已经让它们工作过。如果有人发布更优雅的解决方案，我会很高兴。

Answer 3

######## 编辑########

没错，这很有魅力。

$(function() {
    function loader( thing ) {
        var settings = {
            flash_url : admin_dir + "SWFUpload v2.2.0.1 Samples/demos/swfupload/swfupload.swf",
            upload_url: web_root + "pm_admin/upload_image",
            post_params: { "aj" : "true", "PR" : thing },
            file_size_limit : "100 MB",
            file_types : "*.*",
            file_types_description : "All Files",
            file_upload_limit : 100,
            file_queue_limit : 0,
            custom_settings : {
                progressTarget : "fsUploadProgress",
                cancelButtonId : "btnCancel"
            },
            debug: false,

            // Button settings
            button_image_url: "images/TestImageNoText_65x29.png",
            button_width: "95",
            button_height: "29",
            button_placeholder_id: "spanButtonPlaceHolder",
            button_text: '<span class="theFont">UPLOAD</span>',
            button_text_style: ".theFont { font-size: 16; }",
            button_text_left_padding: 12,
            button_text_top_padding: 3,

            // The event handler functions are defined in handlers.js
            file_queued_handler : fileQueued,
            file_queue_error_handler : fileQueueError,
            file_dialog_complete_handler : fileDialogComplete,
            upload_start_handler : uploadStart,
            upload_progress_handler : uploadProgress,
            upload_error_handler : uploadError,
            upload_success_handler : uploadSuccess,
            upload_complete_handler : uploadComplete,
            queue_complete_handler : queueComplete  // Queue plugin event
        };

        swfu = new SWFUpload(settings);
     };
    function pre_load(){
        var data = '';
        data += '<div class="fieldset flash" id="fsUploadProgress">';
        data += '    <span class="legend">Upload Queue</span>';
        data += '</div>';
        data += '<div id="divStatus">0 Files Uploaded</div>';
        data += '<div>';
        data += '    <span id="spanButtonPlaceHolder"></span>';
        data += '    <input id="btnCancel" type="button" value="Cancel All Uploads" onclick="swfu.cancelQueue();" disabled="disabled" style="margin-left: 2px; font-size: 8pt; height: 29px;" />';
        data += '</div>';
        return data;
    }
    /* args stores the input/select/textarea/radio's name and then it's value and then passes a single serialised string when uploading */
    /* then use a trigger to update the array, off focus, change, keyup... along thos lines on a class set for all inputs, selects and so on... works a treat */
    var args = {};
    $('.radio').click(function(){
        var ob = $(this).siblings('select');
        $('#uploader-wrapper').html(pre_load());
        $('.radio').siblings('select').attr('disabled', 'disabled');
        ob.removeAttr('disabled');
        args[$(this).attr('name')] = $(this).val();
        args[ob.attr('name')] = $(':selected', ob).text();
        loader( $.param(args) );
    })
    $('select[name=foo]').change(function(){
        var ob = $(this);
        $('#uploader-wrapper').html(pre_load());
        args[ob.attr('name')] = $(':selected', ob).text();
        loader( $.param(args) );
    });
});

与形式：

<form id="form1" action="index.php" method="post" enctype="multipart/form-data">
        <p><label>Category: </label><input type="radio" name="for" class="radio" value="category" checked="checked" /><select name="foo"><option>...</option><?php global_data::show_breadcrum_list( 'option', " / " ); ?></select></p>
        <p><label>Product: </label><input type="radio" name="for" class="radio" value="category" /><select disabled="disabled"><option name="foo">...</option><?php global_data::show_breadcrum_list( 'option', " / " ); ?></select></p>    
        <div id="uploader-wrapper">
            <div class="fieldset flash" id="fsUploadProgress">
                <span class="legend">Upload Queue</span>
            </div>
            <div id="divStatus">0 Files Uploaded</div>
            <div>
                <span id="spanButtonPlaceHolder"></span>
                <input id="btnCancel" type="button" value="Cancel All Uploads" onclick="swfu.cancelQueue();" disabled="disabled" style="margin-left: 2px; font-size: 8pt; height: 29px;" />
            </div>
        </div>
    </form>