哪一个更好? Ajax post 或页面 post[Controller httppost] 当页面中只有一个表单时?
Which one is better? Ajax post or page post[Controller httppost] when only one form is there in a page?
我有一个名为 Bookprogram 的页面,其中包含 6 个输入控件,即 txtName、txtEmail、txtPhone、selectcat[类别下拉列表]、txtDate、txtMessage。现在完成上述控件的所有验证后,我想将数据存储在数据库中。我知道如何在 ajax 和整个页面 posting.
中执行
如果它在 ajax 中,在验证之后,我将调用 $.ajax
和 post 数据作为字符串并在控制器中获取它,如下所示:
[HttpPost]
public JsonResult BookProgram(string name, string email, string phone, string category, string date, string message)
{
//code to save into db
return Json(result);
}
如果我必须 post 整个页面,在验证之后我会做一个 $(form).submit();
并在控制器中写如下:
[HttpPost]
public ActionResult Bookprogram(Mymodel model)
{
//Code to save the data
return View();
}
我只是想知道哪个更好、更安全、好用,因为我必须在成功提交后显示一条消息。我知道我可以采用任何一种方式来显示消息,但是在这种情况下是否真的需要 postback[页面刷新]?如果是的话,它比 ajax post 有什么优势?
编辑:
我刚刚经历了 this link 并尝试实施最高投票答案的第二个解决方案,但不幸的是它没有达到控制器本身。我在我的控制器中保留了断点。
$(form).on("submit", function (e) {
e.preventDefault();
ValidateForm(form);
var selectedVal = $(form).find('select').children(":selected").val();
if(selectedVal=="")
{
$(form).find('div.bootstrap-select').children(":first").addClass('alert-danger');
$(form).find('div.bootstrap-select').next('.text-danger').html('Please select a category!');
}
var formContainer = $(form + ' .text-danger');
if ($(formContainer).text().length == 0) {
$.ajax({
url: '/Home/BookProgram/',
type: "POST",
dataType: 'json',
contentType: "application/json; charset=utf-8",
data: $('#fbookprogram').serializeArray(),
success: function (data) {
if (data.result == "Success") {
alert('success');
}
else {
alert('fail');
return false;
}
return true;
}
});
}
$(form).unbind('submit');
return false;
});
控制器:
public ActionResult BookProgram(MyModel model)
{
if(ModelState.IsValid)
{
//code to save data
}
return Json(new { success = false });
}
我在这里缺少什么。
Post返回
- 浏览器处理 - 我能想到的唯一优点是浏览器会为您处理重定向和进度加载。您无需编写重定向用户或显示加载栏的逻辑。
AJAX
异步 -
使用 AJAX 您将获得异步调用,因此浏览器线程不会被阻塞。这允许用户在等待您的请求响应时仍然与 UI 交互。
更好的性能 - 您通常不需要重新加载整个页面,从而减少开销和发出 HTTP 请求。
仅供参考 - 您仍然可以使用 JsonResult 进行模型绑定
public JsonResult BookProgram(Mymodel model)
{
//code to save into db
return Json(result);
}
Post回——是经典的工作流程。将大部分内部工作委托给您的网络浏览器。您所有的响应逻辑都在服务器端计算。
AJAX - 是构建动态网络应用程序的现代方式。单页应用程序的基本方法。这种情况下的大部分工作应该在客户端完成。
我有一个名为 Bookprogram 的页面,其中包含 6 个输入控件,即 txtName、txtEmail、txtPhone、selectcat[类别下拉列表]、txtDate、txtMessage。现在完成上述控件的所有验证后,我想将数据存储在数据库中。我知道如何在 ajax 和整个页面 posting.
中执行如果它在 ajax 中,在验证之后,我将调用 $.ajax
和 post 数据作为字符串并在控制器中获取它,如下所示:
[HttpPost]
public JsonResult BookProgram(string name, string email, string phone, string category, string date, string message)
{
//code to save into db
return Json(result);
}
如果我必须 post 整个页面,在验证之后我会做一个 $(form).submit();
并在控制器中写如下:
[HttpPost]
public ActionResult Bookprogram(Mymodel model)
{
//Code to save the data
return View();
}
我只是想知道哪个更好、更安全、好用,因为我必须在成功提交后显示一条消息。我知道我可以采用任何一种方式来显示消息,但是在这种情况下是否真的需要 postback[页面刷新]?如果是的话,它比 ajax post 有什么优势?
编辑:
我刚刚经历了 this link 并尝试实施最高投票答案的第二个解决方案,但不幸的是它没有达到控制器本身。我在我的控制器中保留了断点。
$(form).on("submit", function (e) {
e.preventDefault();
ValidateForm(form);
var selectedVal = $(form).find('select').children(":selected").val();
if(selectedVal=="")
{
$(form).find('div.bootstrap-select').children(":first").addClass('alert-danger');
$(form).find('div.bootstrap-select').next('.text-danger').html('Please select a category!');
}
var formContainer = $(form + ' .text-danger');
if ($(formContainer).text().length == 0) {
$.ajax({
url: '/Home/BookProgram/',
type: "POST",
dataType: 'json',
contentType: "application/json; charset=utf-8",
data: $('#fbookprogram').serializeArray(),
success: function (data) {
if (data.result == "Success") {
alert('success');
}
else {
alert('fail');
return false;
}
return true;
}
});
}
$(form).unbind('submit');
return false;
});
控制器:
public ActionResult BookProgram(MyModel model)
{
if(ModelState.IsValid)
{
//code to save data
}
return Json(new { success = false });
}
我在这里缺少什么。
Post返回
- 浏览器处理 - 我能想到的唯一优点是浏览器会为您处理重定向和进度加载。您无需编写重定向用户或显示加载栏的逻辑。
AJAX
异步 - 使用 AJAX 您将获得异步调用,因此浏览器线程不会被阻塞。这允许用户在等待您的请求响应时仍然与 UI 交互。
更好的性能 - 您通常不需要重新加载整个页面,从而减少开销和发出 HTTP 请求。
仅供参考 - 您仍然可以使用 JsonResult 进行模型绑定
public JsonResult BookProgram(Mymodel model)
{
//code to save into db
return Json(result);
}
Post回——是经典的工作流程。将大部分内部工作委托给您的网络浏览器。您所有的响应逻辑都在服务器端计算。
AJAX - 是构建动态网络应用程序的现代方式。单页应用程序的基本方法。这种情况下的大部分工作应该在客户端完成。