1

我有一个简单的 HTML 页面，我想将文件从客户端机器上传到服务器端，在这里我尝试使用 Kendo UI 控制上传文件，但它不能正常工作，我在下面给出了我的代码详细信息。

包含的 JS 文件是“kendo.all.min.js”和受尊重的 CSS 文件，

用于上传的代码，

$("#btnUpload").kendoUpload({
    async: {
        saveUrl: 'http://localhost:8080/Project1/Cifernet/upload/',
        autoUpload: false
    },
    multiple: true,
    localization: {
        select: 'Select a file',
        uploadSelectedFiles: 'Send',
        error: onError

    }
});


FYI: i got below error from Mozilla console while uploading a file.
[10:04:33.900] Use of getPreventDefault() is deprecated.  
Use defaultPrevented instead. @ http://localhost:8080/Project1/Scripts/jquery-1.8.3.js:3255
[10:04:34.193] GET http://localhost:8080/Project1/Styles/textures/highlight.png [HTTP/1.1 404 Not Found 0ms]
--
[10:04:40.506] POST http://localhost:8080/Project1/upload/POST [HTTP/1.1 404 Not Found 0ms]
[10:04:40.507] GET http://localhost:8080/Project1/Styles/Images/loading.gif [HTTP/1.1 404 Not Found 0ms]
[10:04:40.467] "Server response: <html><head><title>Apache Tomcat/6.0.18 - Error report</title><style><!--H1 {font-family:Tahoma,Arial,sans-serif;color:white;background-color:#525D76;font-size:22px;} H2 {font-family:Tahoma,Arial,sans-serif;color:white;background-color:#525D76;font-size:16px;} H3 {font-family:Tahoma,Arial,sans-serif;color:white;background-color:#525D76;font-size:14px;} BODY {font-family:Tahoma,Arial,sans-serif;color:black;background-color:white;} B {font-family:Tahoma,Arial,sans-serif;color:white;background-color:#525D76;} P {font-family:Tahoma,Arial,sans-serif;background:white;color:black;font-size:12px;}A {color : black;}A.name {color : black;}HR {color : #525D76;}--></style> </head><body><h1>HTTP Status 404 - /Project1/upload/POST</h1><HR size="1" noshade="noshade"><p><b>type</b> Status report</p><p><b>message</b> <u>/Project1/upload/POST</u></p><p><b>description</b> <u>The requested resource (/Project1/upload/POST) is not available.</u></p><HR size="1" noshade="noshade"><h3>Apache Tomcat/6.0.18</h3></body></html>"
[10:04:40.511] GET http://localhost:8080/Project1/Styles/textures/highlight.png [HTTP/1.1 404 Not Found 0ms]

任何人请帮我解决这个问题，或者请建议最好的 jQuery 插件和工作示例，以将文件上传到服务器。

4

2 回答 2

0

试试这个例子来说明你的问题

<html>
<head>
    <title></title>
    <link href="styles/kendo.common.min.css" rel="stylesheet" />
    <link href="styles/kendo.default.min.css" rel="stylesheet" />
    <script src="js/jquery.min.js"></script>
    <script src="js/kendo.all.min.js"></script>
</head>
<body>

        <div id="example" class="k-content">
            <div class="configuration">
                <span class="infoHead">Information</span>
                <p>
                    The Upload can be used as a drop-in replacement
                    for file input elements.
                </p>
                <p>
                    This "synchronous" mode does not require
                    special handling on the server.
                </p>
            </div>
            <form method="post" action="submit" style="width:45%">
                <div class="demo-section">
                    <input name="files" id="files" type="file" />
                    <p>
                        <input type="submit" value="Submit" class="k-button" />
                    </p>
                </div>
            </form>
            <script>
                $(document).ready(function() {
                    $("#files").kendoUpload();
                });
            </script>
        </div>


</body>
</html>
于 2013-10-16T04:43:28.760 回答
-2

Telerik 网站上有一个很好的演示：

http://demos.telerik.com/aspnet-mvc/upload/async

下面的代码来自该演示站点。

在剃刀中，您的 GUI 代码将是：

        @(Html.Kendo().Upload()
        .Name("files")
        .Async(a => a
            .Save("Save", "Upload")
            .Remove("Remove", "Upload")
            .AutoUpload(true)
        )
    )

然后您将创建一个 Upload 控制器，Save 方法如下所示：

    public ActionResult Save(IEnumerable<HttpPostedFileBase> files)
    {
        // The Name of the Upload component is "files"
        if (files != null)
        {
            foreach (var file in files)
            {
                // Some browsers send file names with full path.
                // We are only interested in the file name.
                var fileName = Path.GetFileName(file.FileName);
                var physicalPath = Path.Combine(Server.MapPath("~/App_Data"), fileName);

                // The files are not actually saved in this demo
                // file.SaveAs(physicalPath);
            }
        }

        // Return an empty string to signify success
        return Content("");
    }

如您所见， ~/App_Data 是文件的路径，我认为这就是您所追求的。

于 2014-10-07T21:24:17.760 回答