Ajax call doesn't load the page but enters the .fail?
this is the MVC app I'm currently working on. So there is a page that displays the product details. This page has a link that loads another page that shows a set of rules for processing this product.
Here's what I've tried now:
The controller does nothing at the moment:
public class ProductRuleController : Controller
{
[HttpGet]
public ActionResult GetAllRulesForProduct(string productId)
{
return View("AddEditProductRule");
}
}
View:
@{
ViewBag.Title = "Add / Edit Product Rule";
}
<h2>Add / Edit Rule</h2>
Js
function ShowProductRules() {
var urlToGetProductRules = "/ProductRule/GetAllRulesForProduct/";
var productId = $('#ProductId').val();
if (productId == null) {
alert('Please Check the ProductId');
}
else {
// Make an ajax call passing in the ProductId
alert('ProductId: ' + productId);
$.ajax({
type: "Get",
url: urlToGetProductRules,
data: { productId: productId },
dataType: "json"
})
.done(function (data) {
})
.fail(function (xhr) {
alert("Something went wrong!!!")
console.log(xhr.responseText);
});
}
The ajax call goes to the .fail part. I checked responseText and it has rquired HTML with no errors.
So my question is, when there is the desired HTML in the response, why does it go to Fail? What am I doing wrong?
Thanks in advance.
source to share
remove the part dataType: "json"
from the ajax call
i.e
$.ajax({
type: "Get",
url: urlToGetProductRules,
data: { productId: productId },
})
.done(function (data) {
})
.fail(function (xhr) {
alert("Something went wrong!!!")
console.log(xhr.responseText);
});
When you specify dataType : "json"
, the ajax call expects a json response.If its html, it will treat it as an error, so the failure part will be done. If you still want to use dataType : "json"
then convert the response to json format.
source to share