C1Upload页面与Controller的相关问题

收藏

我的需求，就是用户在本页面上传一个或者是多个文件之后，我还是在这个页面将

这些文件的相关信息都显示给用户，甚至可以让用户可以编辑部分信息。

但是目前采用C1Upload上传，一个ashx文件来接受文件，并写入上传文件夹，

显然是不满足需求的。因为我的ashx处理文件也就是一个HttpHandler没有办法

将处理权交给Controller。所以我觉得能否做一个C1Upload的Demo，需要从页面

上传文件并将之交给Controller。

Alice · Alice

回复 1楼ronger的帖子

你好。
之前我们就C1Upload上传在另一个帖子里有过详细的沟通。
根据你提到的内容，是想在那个基础上扩展需求。
在安装了ASP.NET MVC Tools后，可以在本地得到Controllers的详细代码，路径如下：
C:\Users\username\Documents\ComponentOne Samples\Studio for ASP.NET Wijmo\ASP.NET MVC Tools\CS\WijmoMVC\WijmoMVC\Controllers
里面的username是你本机的名字。

ronger · ronger

我已经找到了你说的这个例子C:\Users\username\Documents\ComponentOne Samples\Studio for ASP.NET Wijmo\ASP.NET MVC Tools\CS\WijmoMVC\WijmoMVC\Controllers，我建好的工程是wijmo下的MVC4工程
（在开发工具visual studio2012中可以选择到），然后将cshtml页面和controller放入
我的开发工程中，但是点击上传按钮的时候，并没有调用其对应的Controller，所以我
还在摸索。在_layout.cshtml中寻找，看是否是因为缺少javascript的原因？

Alice · Alice

回复 3楼ronger的帖子

如何写Controller可以参考我上面给出的路径里面的文件。
要调用对应的Controller，需要建立他们之间的关系，这部分需要自己写代码完成。这是属于MVC模式的内容。

ronger · ronger

经过设置断点，了解到了UploadController有如下特性：
1。无论是点击某个文件后面的上传按钮，还是点击Upload All 按钮，UploadController中的Upload方法都执行if (!String.IsNullOrEmpty(requestType) && requestType == "XMLHttpRequest")中的内容，而不是else中的内容。当然我猜测页面上应该有一个设置requestType 也就是Request.Headers["Wijmo-RequestType"]的值的地方，只是我不知道而已。
2.上传文件的名字如果为英文名，那是没有问题的，如果为中文名，则会变为类似于%E5%85%8D%E8%B4%B9%E6%A8%A1%E6%9D%BF.jpg的内容，这样我还
需要自己转换编码。
3.页面上需要通过return Json(true, "text/html");的方式获得返回值，来确定上传
是否成功。
4.结合我在一楼上的需求，我的困难有两个地方：一、requestType == "XMLHttpRequest")的方式上传文件，我无法取到所有文件的详细信息，包括文件名，文件大小。二、return Json(true, "text/html");让我想给用户返回一些其他的信息很困难，而且页面Javascript中接受信息的代码在哪里，怎么写。

ronger · ronger

我猜测一下UploadController的Upload方法的设计初衷应该是：
1.if (!String.IsNullOrEmpty(requestType) && requestType == "XMLHttpRequest")对应的应该是某个文件后面的上传按钮。
2.else后的处理动作对应的应该是Upload All上传按钮。
总结：目前例子中的行为不是这样，如果点击Upload All按钮，假如上传的文件有三个，就会
调用三次UploadController中的Upload方法。我想问一下，是不是在Overview.cshtml中设置
一下，可以出现和我猜测一致的行为。

Alice · Alice

回复 5楼ronger的帖子

可以在wijmoupload的客户端事件，比如OnClientUpload中获取到文件信息，包括文件名和文件大小。其他信息也可以得到。
JS代码参考：

<script type="text/javascript">
var size;
var name;
function clientUpload(e, data) {
name = "FileName:" + data[0].files[0].name;
size = "FileSize:" + data[0].files[0].size;
}
function totaluploadcomplete() {
alert("所有文件上传成功。");
}
function uploadcomplete() {
alert("当前文件上传成功。"+name+size.toString());
document.location.reload();
}
</script>

复制代码

可以通过upload的MaximumFiles和MaximumFileSize分别限制上传文件的数量和文件的大小。

ronger · ronger

目前我已经通过在UploadController中将上传文件的信息放入Session，然后

通过另外一个按钮--（名为详细情况），通过Ajax的方式从服务器端取到上传文件

的详细信息来显示，其中文件名进行了UTF-8到汉字的转码。界面如下所示：

看到楼上在javascript中用到两个函数function totaluploadcomplete()和

function uploadcomplete()，分别代表全部上传成功和一个文件上传成功，

我就准备将详细情况这个按钮去掉，而直接在这两个函数中，通过JQuery

的Ajax方式从服务器端取到上传文件的详细信息来显示。这是一个想法，

正在尝试。谢谢！

Alice · Alice

回复 8楼ronger的帖子

好的。
如果有问题我们再交流。

ronger · ronger

通过如下方式已经实现了我的需求：
1.在页面上加入链接：
@Html.ActionLink("详细情况3", "detail", null, new { id = "detailLink" })
同时加入js，这是JQuery的Ajax方式，最后让这个链接隐藏掉：
            $('#detailLink').click(function (event) {
            event.preventDefault();
            var url = $(this).attr('href');
            $('#detail').load(url);
         });
         $('#detailLink').hide(true);
上传完成后的js代码：
               complete: function (e, data) {
                  $("#detailLink").click();
            },
            totalComplete: function () {
               .............
                  $("#detailLink").click();
            },
2.在Controller中加入方法
public ActionResult detail()
{
      ............
      return PartialView(uploadView);
}
3.新建detail.cshtml

   经过测试，在Chrome浏览器和FireFox浏览器中，可以实现

上传成功后，通过Ajax的方式从Controller中取到上传信息。

但是在360浏览器中，第一次上传时有取到上传文件详细信息，但是

第二次，第三次就不行了。这个问题我下去慢慢的思考吧！

		自动登录	找回密码
密码			立即注册

C1Upload页面与Controller的相关问题

16 个回复

本帖子中包含更多资源

活字格认证

微信认证勋章

元老葡萄