javascript flow.js 点击上传文件
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/25740110/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
flow.js upload file on click
提问by Simon
Hopefully someone can help with this.
希望有人可以帮助解决这个问题。
Basically, we are using ng-flow https://github.com/flowjs/ng-flowto allow for drag and drop to upload items. We are also using MVC 4.
基本上,我们使用 ng-flow https://github.com/flowjs/ng-flow来允许拖放上传项目。我们也在使用 MVC 4。
All seems to be working as should, however, we would like to customize this, so that
一切似乎都在正常工作,但是,我们想对其进行自定义,以便
- Items are dragged into the upload box and stored in scope (as it does now)
- Items are not physically uploaded until a button has been clicked
- 项目被拖到上传框中并存储在范围内(就像现在一样)
- 在单击按钮之前不会实际上传项目
What have we tried so far? :-
到目前为止我们尝试了什么?:-
in the config, we have disabled the target so that it doesn't upload immediately
在配置中,我们禁用了目标,使其不会立即上传
.config(['flowFactoryProvider', function (flowFactoryProvider) {
flowFactoryProvider.defaults = {
target: '',
permanentErrors: [500, 501],
maxChunkRetries: 1,
chunkRetryInterval: 5000,
simultaneousUploads: 1
};
on the actual page, we have created a button, with an ng-click which will pass through the flow.files
在实际页面上,我们创建了一个按钮,通过 ng-click 将通过 flow.files
<input type="button" value="Click Me" ng-click="uploadme($flow.files)">
in the controller, we have the function, uploadme, that accepts flows as a paramater. Looping through this paramater and post each "file" to the upload controller
在控制器中,我们有函数uploadme,它接受流作为参数。循环遍历此参数并将每个“文件”发布到上传控制器
$scope.uploadme= function (flows)
{
angular.forEach(flows, function (flow) {
var fd = new FormData();
fd.append("file", flow);
$http.post("upload", fd, {
withCredentials: true,
headers: {'Content-Type': undefined },
transformRequest: angular.identity
})
});
}
MVC controller, 'upload'. this get called, however, file is always null
MVC 控制器,“上传”。这被调用,但是,文件始终为空
public ActionResult upload(HttpPostedFileBase file)
{
if (file.ContentLength > 0)
{
var fileName = Path.GetFileName(file.FileName);
var path = Path.Combine(Server.MapPath("~/App_Data/uploads"), fileName);
file.SaveAs(path);
}
return View();
}
Is there something that we are missing? or is there a different way to achieve this.
有什么我们遗漏的吗?或者有没有不同的方法来实现这一点。
回答by Simon
managed to resolve this...
设法解决了这个问题...
remove the line from div tag
从 div 标签中删除该行
flow-files-submitted="$flow.upload()"
then onclick of a button, pass in $flow in as a paramater
然后点击一个按钮,将 $flow 作为参数传入
ng-click="InsertItems($flow)"
Javascript:-
Javascript:-
$scope.InsertItems = function(e)
{
//Do what you need to do
e.upload();
}
回答by Raúl Ota?o
I only want to add a reference to a nice answer to this question: Ng-flow upload programmatically
我只想为这个问题的一个很好的答案添加一个参考: Ng-flow upload programmatically
Hope it helps.
希望能帮助到你。