How to call a partial view using JQUERY
I am trying to load a partial view using ajax. But this gives me an error like Internal char error
. I am debugging the code, then calling the action, and also able to debug the partial view, but after the last line of the partial view, it gives me an internal char error.
below is a partial view:
@model company.learn.data.Models.ProductViewModel
<div></div>
The action code looks like this:
public ActionResult LoadProducts()
{
RepositoryProductManager m = new Repository.ProductManager();
var p = m.RetrieveAllProducts();
var l = p.Select(o => new ProductViewModel() { Cost = o.Cost, Description = o.Description, Id = o.Id, ProductName = o.ProductName, ProductTypeName = o.ProductType.Name, ProductTypeId = o.ProductTypeId }).ToList().FirstOrDefault();
return PartialView("_LoadProducts",l);
}
jquery ajax call:
@section scripts
{
<script>
$.getJSON('@Url.Action("LoadProducts","ProductManagement")', null, function (data) {
alert('f');
//$('#ProductsDiv').html(data);
alert('f');
}
).error(function (e1, e2, e3) { alert(e3); }); //every time goes to alert this error.
</script>
}
When I remove the DIV element from the partial view and only keep the first line (model binding) then it didn't give me an error, but when I add any element to that view then it gives me an error.
Please tell us about the strange behavior.
thank
source to share
Yes, try ajax post. instead of getJSON (). see full ajax config if above doesn't work. if still not working please let me know.
$.ajax({
url: "/ProductManagement/LoadProducts",
contentType:'application/html; charset=utf-8',
type:'GET',
dataType:'html',
success: function (evt) {
},
error: function (req, status, error) {
}
});
source to share
You can use jQuery $. get () as follows:
@section scripts
{
<script>
$.get('/ProductManagement/LoadProducts', null, function (data){
alert('f');
//$('#ProductsDiv').html(data);
alert('f');
}
).error(function (e1, e2, e3) { alert(e3); }); //every time goes to alert this error.
</script>
}
source to share