如何在c#中创建一条带有警告消息的成功消息

Question

我的警报框有问题。我想做的是，在我调用了一个c之后，函数工作正常，它会发出一个成功的消息。但实际情况是，它在一个全新的页面上发出了成功的信息。

public async Task<JsonResult> Upload(IList<IFormFile> files)
{
//does my stuff 
string msg = "Succesfully uploaded";
return Json(new { Message = msg });
}

这是我做的脚本。

function Function() {
$.ajax(
{
url: "home/Upload",
data: "hello",
processData: false,
contentType: false,
type: "POST",
success: function (data) {
alert(data);
}
})
}

以下是视图：

@using (Html.BeginForm("Upload", "home", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
<input asp-file="file" id="files" name="file" onchange="CallFunction('files')" type="file" />
<input type="submit" name="Submit" id="Submit" onclick="Function"  style="display:none" />
}

Answer 1

因此，您需要将提交按钮更改为此

<input type="button" value="Submit" onclick="Function()" name="Submit" id="Submit"/>

你可以看到我已经改变了类型="；提交"；到type＝"；按钮">

此外，您还可以删除BeginForm语法，因为您将使用ajax提交表单

以下是提交请求后的脚本

function Function() {
$.ajax(
{
url: "/Home/Upload",
data: "hello",
processData: false,
contentType: false,
type: "POST",
success: function (data) {
alert(data);
}
})
}

Answer 2

您必须使用Ajax发布表单。使用您的代码，整个页面将被发布到服务器。

将视图更改为：

@using (Html.BeginForm("Upload", "home", FormMethod.Post, new { enctype = "multipart/form-data" ,id = "uploadForm"}))
{
<input asp-file="file" id="files" name="file" onchange="CallFunction('files')" type="file" />
<input type="submit" name="Submit" id="Submit" onclick="Function"  style="display:none" />
}

添加节脚本

@section scripts { 
<script>
$("#uploadForm").submit(function(e) { // note that it's better to use form Id to select form
e.preventDefault(); // here you stop submitting form
uploadFile();
});
function uploadFile() {
$.ajax({
url: "home/Upload",
data: "hello",
processData: false,
contentType: false,
type: "POST",
success: function(data) {
alert(data);
}
})
} 
</script>
}

Answer 3

您向控制器发送了错误类型的数据。U正在发送一个"；字符串"；以及url："；主页/上传"；同样错误的，必须是url:/主页/上传"；

Answer 4

function Function(inputId) {
var input = document.getElementById(inputId);
var files = input.files;
var formData = new FormData();
for (var i = 0; i != files.length; i++) {
formData.append("files", files[i]);
}
$.ajax(
{
url: "/home/Upload",
data: formData,
processData: false,
contentType: false,
type: "POST",
success: function (data) {
alert(data);
}
}
);
}