【问题标题】:Cannot post a particuliar data with jQuery Form Plugin ajaxForm无法使用 jQuery 表单插件 ajaxForm 发布特定数据
【发布时间】:2013-02-19 12:34:40
【问题描述】:

我正在尝试使用这 2 个 jQuery 插件:pluploadjQuery Form Plugin ajaxForm

它工作正常,除了一件事:我无法发送之前使用 plupload 上传的文件的 file.name(使用 ajaxForm)。

我稍微解释一下:用户用plupload发送一个文件。文件已上传。它工作正常。

然后,用户使用 ajaxForm 提交表单,并使用 post 方法发送表单数据 + 文件名。

我知道如何使用 ajaxform 发送数据,这段代码运行良好:

var value1 = "dynamic_value1";
$('#my_form').ajaxForm({ 
        // datas is sent in post method, it works fine
        data: { value1: value1 }, 
        beforeSubmit: validate,
            success: function() { 
            // it's ok :
            //alert(value1);
        } 
    });

但我不能用 pluplopad file.name 执行此操作,如果我发出警报但我无法发送它,我可以看到文件名:

Plupload 代码以获取文件名(有效): var file_name_vous;

uploader.bind('FileUploaded', function(up, file, response) {

            // It's ok : i can get file name, alert show me the file name
            file_name_vous = encodeURIComponent(file.name);
            alert(file_name_vous);
        //};
    });
});

但我不能这样做,这段代码不起作用:

$participer_form.ajaxForm({ 
        type: 'POST',
        data: { 
        // impossible to send this var
        file_name_vous: file_name_vous
        }, 
        beforeSubmit: validate,

            // success 
            success: function() { 
                // It's ok, alert shows the file name 
                alert(file_name_vous);    
        } 
    });

所以我不明白,我可以用 post 方法发送数据,我已经测试过了。但我不能发送这个特定的 var:file_name_vous = encodeURIComponent(file.name);

你知道在尝试通过 post 方法发送之前我应该​​对 (file.name) 做些什么吗?

我没有错误,只是在 firebug 网络/XHR 中,我没有看到任何关于这个 var 的信息。如果我用 var value1 = "dynamic_value1" 替换这个 var,它就可以工作。所以我想,我的问题是关于这个partuliar var file.name

【问题讨论】:

  • 你为什么用plupload??? Malsups Ajax 表单插件支持通过 AJAX 上传,事实上它以最好的方式支持它,它构建浏览器在提交带有文件上传的表单时构建的数据,如果你想要上传进度,你不需要另一个确保 AJAX 表单插件支持此
  • 至于我的最后一条评论,关于通过 ajax 表单上传文件的问题请参见 stackoverflow.com/questions/9883564/…
  • 我猜file_name_vous 在提交后填充了值。
  • jsfiddle.net/PHzxy 这是一个使用进度条的示例,使用 malsups 它与本机 php 表单提交 $_GET 一起使用,这是一个使用标准表单构建的示例,该构建工作然后添加 AJAX 表单那么您将最好地了解您的 php 正在做什么以及它是如何完成的,tizag.com/phpT/fileupload.php
  • 我对 ajaxForm 有同样的问题。它会在加载时创建 data: { value1: value1 },因此您无法更改它。我放弃了这样的东西 $('#my_form').ajaxForm({ url : 'site.com/?value1=value1'});

标签: php javascript jquery plupload jquery-forms-plugin


【解决方案1】:

也许您应该省略 ajax 表单的数据部分,只需在成功上传后创建一个隐藏字段,该字段将与您的表单一起提交。

类似这样的:

uploader.bind('FileUploaded', function(up, file, response) {

            // It's ok : i can get file name, alert show me the file name
            file_name_vous = encodeURIComponent(file.name);
            // maybe you'll have to check if hidden filed already exists
            $participer_form.Append($('<input type="hidden" value="'+file_name_vous+'" id="file_name_vous" name="file_name_vous"/>'));
        //};

希望这会有所帮助

顺便说一句,你有没有试过这个,尽可能晚地设置值?

uploader.bind('FileUploaded', function(up, file, response) {

            // It's ok : i can get file name, alert show me the file name
            file_name_vous = encodeURIComponent(file.name);
    $participer_form.ajaxForm({ 
            type: 'POST',
            data: { 
            // impossible to send this var
            file_name_vous: file_name_vous
            }, 
            beforeSubmit: validate,

                // success 
                success: function() { 
                    // It's ok, alert shows the file name 
                    alert(file_name_vous);    
            } 
        });
    });

【讨论】:

  • 谢谢,这正是我所做的:file_name = encodeURIComponent(file.name); $('input#file_name').val(file_name);它表明问题与 ajaxForm 有关,因为在这种情况下 file.name 没有问题
  • @SébastienGicquel 也许您可以在稍后的过程中尝试设置该值。为我的答案添加了另一个选项
  • 非常感谢,它有效!我花了几个小时在这上面,最后这是一个合乎逻辑的问题
猜你喜欢
  • 2019-09-06
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-10-27
  • 1970-01-01
相关资源
最近更新 更多