我使用dropzone js上传文件。我想传递一些输入字段,如标题和描述。我使用了发送活动,但不知道如何在我的C#控制器中捕获该数据。请帮忙。
这是我的js代码。
<div id="my-awesome-dropzone" class="dropzone">
<div class="dropzone-previews"></div> <!-- this is were the previews should be shown. -->
<!-- Now setup your input fields -->
<input type="text" name="Title" id="Title" placeholder="Title" />
<input type="text" name="Description" id="Description"/>
<button type="submit">Submit data and files!</button>
</div>
@section scripts
{
<script type="text/javascript">
sabio.page.startUp = function () {
sabio.page.initializeDropzone();
};
sabio.page.initializeDropzone = function () {
Dropzone.options.myAwesomeDropzone = { // The camelized version of the ID of the form element
// The configuration we've talked about above
autoProcessQueue: false,
uploadMultiple: false,
parallelUploads: 1,
maxFiles: 1,
maxFilesize: 5,
url: "/api/MediaUploader/upload",
// The setting up of the dropzone
init: function () {
var myDropzone = this;
// First change the button to actually tell Dropzone to process the queue.
this.element.querySelector("button[type=submit]").addEventListener("click", function (e) {
// Make sure that the form isn't actually being sent.
e.preventDefault();
e.stopPropagation();
myDropzone.processQueue();
});
this.on("sending", function (file, xhr, formData) {
// Will send the filesize along with the file as POST data.
formData.append("Title", $('#Title').val());
console.log("formdata is " + formData.Title)
});
// Listen to the sendingmultiple event. In this case, it's the sendingmultiple event instead
// of the sending event because uploadMultiple is set to true.
this.on("sendingmultiple", function () {
// Gets triggered when the form is actually being sent.
// Hide the success button or the complete form.
});
this.on("successmultiple", function (files, response) {
// Gets triggered when the files have successfully been sent.
// Redirect user or notify of success.
});
this.on("errormultiple", function (files, response) {
// Gets triggered when there was an error sending the files.
// Maybe show form again, and notify user of error
});
}
}
};
</script>
}
这是我的C#控制器代码。
[Route("upload")]
public HttpResponseMessage Upload()
{
HttpResponseMessage result = null;
var httpRequest = HttpContext.Current.Request;
ItemResponse<int> response = new ItemResponse<int>();
if (httpRequest.Files.Count > 0)
{
string filePath = null;
string fileName = null;
//string fileTitle = null;
var docfiles = new List<string>();
foreach (string file in httpRequest.Files)
{
var postedFile = httpRequest.Files[file];
filePath = HttpContext.Current.Server.MapPath("~/Media/" + postedFile.FileName);
fileName = postedFile.FileName;
//fileTitle = postedFile.;
postedFile.SaveAs(filePath);
docfiles.Add(filePath);
// upload to amazon S3
FileUploadService uploadNow = new FileUploadService();
uploadNow.uploadFiles(filePath, fileName);
MediaRequestModel mediaModel = new MediaRequestModel();
mediaModel.FileName = fileName.Substring(0, fileName.LastIndexOf("."));
mediaModel.Path = "C15";
mediaModel.MediaType = fileName.Substring(fileName.Length - 3);
// insert into db.
//MediaService.InsertMedia(mediaModel);
response.Item = MediaService.InsertMedia(mediaModel);
}
result = Request.CreateResponse(HttpStatusCode.Created, docfiles);
}
else
{
result = Request.CreateResponse(HttpStatusCode.BadRequest);
}
return Request.CreateResponse(response);
}
感谢。
答案 0 :(得分:0)
简化为:
HttpContext.Current.Request.Form["Title"]
然后您可以通过以下方式访问控制器中的值:
{{1}}
......或者可能会将“Title”作为控制器中的参数。