Recently, I came across the issue in nopCommerce that is weird, to say the least - whenever I try to execute "POST" request via AJAX I get "400 Bad Request" error.
When I try to execute the same method using "GET" request I do not have any issue.
Below is the example of what I am trying to do:
In my plugin controller (FormularyController) that inherits BaseAdminController, I have created 2 methods: one with HttpPost and another with HttpGet attribute.
[HttpPost]
public IActionResult TestPost(int customerId)
{
if (!_permissionService.Authorize(StandardPermissionProvider.ManagePlugins))
return AccessDeniedView();
try
{
}
catch (Exception e)
{
return Json(new { success = true, message = e.Message });
}
return Json(new { success = true });
}
[HttpGet]
public IActionResult TestGet(int customerId)
{
if (!_permissionService.Authorize(StandardPermissionProvider.ManagePlugins))
return AccessDeniedView();
try
{
}
catch (Exception e)
{
return Json(new { success = true, message = e.Message });
}
return Json(new { success = true });
}
On the client side I have function that triggers on click and calls TestGet and TestPost method via AJAX.
$("#my-button").click(function () {
var data = {
customerId : 15
};
addAntiForgeryToken(data);
$.ajax({
url: "@Url.Action("TestPost", "Formulary")",
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
data: data,
success: function (result) {
if (result.success) {
}
}
});
$.ajax({
url: "@Url.Action("TestGet", "Formulary")",
type: "GET",
contentType: "application/json; charset=utf-8",
dataType: "json",
data: data,
success: function (result) {
if (result.success) {
}
}
});
});
Once the button is clicked I have no issue with executing TestGet method.
Regarding TestPost method - I am getting 400 - Bad Request response.
Probably, the strangest part of this issue is the fact that calling a post method from Kendo Grid does not produce any issue.
In the same controller, I also do have the following method:
[HttpPost]
public IActionResult ProductList(FormularySearchModel searchModel)
{
if (!_permissionService.Authorize(StandardPermissionProvider.ManagePlugins))
return AccessDeniedKendoGridJson();
FormularyListModel model = _formularyModelFactory.PrepareFormularyListModel(searchModel);
return Json(model);
}
On the client side I have
$("#data-grid").kendoGrid({
dataSource: {
type: "json",
transport: {
read: {
url: "@Html.Raw(Url.Action("ProductList", "Formulary"))",
type: "POST",
dataType: "json",
data: function () {
var customerId = [];
$("#customers").data("kendoMultiSelect").dataItems().forEach(function (element) {
customerId.push(element.Id);
});
var data = {
CustomerId: customerId[0]
};
addAntiForgeryToken(data);
return data;
}
},
I would be very grateful if you could provide me with any information on how to resolve this issue or at least understand why is this issue happening.
Thanks!
