В основном @Html.ActionLink() помощник отображает тег привязки (<a>) с атрибутами и по умолчанию использует запрос GET, обновляя всю страницу, поэтому вам необходимо добавить preventDefault() для использования обратного вызова AJAX из этого элемента. Если в методе действия используется метод HTTP GET, вы можете выполнить простой вызов AJAX для общего класса якорной ссылки, например:
$('.text-info').on('click', function (e) {
e.preventDefault();
var url = $(this).attr('href');
$.get(url, function (response) {
// do something with AJAX response
});
});
Однако, поскольку целевое действие контроллера помечено как [HttpPost], вам необходимо извлечь параметры строки запроса из атрибута href с помощью дополнительной функции и использовать их в вызове AJAX с настройкой type: 'POST' или использовать $.post():
$('.text-info').on('click', function (e) {
e.preventDefault(); // mandatory to prevent GET request
var url = $(this).attr('href');
var pcs = getQueryStringParams(url, 'ProductCodeScheme');
var pc = getQueryStringParams(url, 'ProductCode');
var sn = getQueryStringParams(url, 'SerialNumber');
var batch = getQueryStringParams(url, 'Batch');
var expDate = getQueryStringParams(url, 'ExpirationDate');
var csc = getQueryStringParams(url, 'CommandStatusCode');
// create key-value pair for action method parameters
var obj = { ProductCodeScheme: pcs, ProductCode: pc, SerialNumber: sn, ... }
$.ajax({
type: 'POST',
url: url.split('?')[0], // URL without query string, or use '@Url.Action("VerifyPack", "Home")'
data: obj,
dataType: 'json', // expects response as JSON
success: function (response) {
// do something with AJAX response
},
error: function (xhr, status, err) {
// error handling
}
});
// just make sure that the link is not redirecting
return false;
});
function getQueryStringParams(url, name) {
return (RegExp(name + '=' + '(.+?)(&|$)').exec(url)||[,null])[1];
}
На самом деле существует другой способ вызова AJAX из тега привязки, например @Ajax.ActionLink(), в зависимости от вашего выбора:
@Ajax.ActionLink("Verify Pack", "VerifyPack", "Home", new { ProductCodeScheme = @item.ProductCodeScheme, ProductCode = @item.ProductCode, SerialNumber = @item.SerialNumber, Batch = @item.Batch, ExpirationDate = @item.ExpirationDate, CommandStatusCode = 0 },
new AjaxOptions { HttpMethod = "POST",
InsertionMode = InsertionMode.Replace,
UpdateTargetId = "targetElementId",
OnComplete = "onComplete();"
},
new { @class = "text-info" })
Примечание:
Если вам нужно обработать AJAX-запрос и обычный запрос от одного и того же контроллера, вы можете различить их, используя Request.IsAjaxRequest() (или Context.Request.Headers["X-Requested-With"] == "XMLHttpRequest" в Core MVC).