unobtrusive-ajax fetches the whole page, not just partial view
Someone who has an Umbraco AJAX example using paging in a table where only partial view is updated - not the whole page?
I've started an attempt from this https://www.youtube.com/watch?v=sfuucXwJ-eM (Paging using Ajax form and Partial Views in MVC5 Code First Entity) rewritten from Entity to Petapoco database with custom table added to original Umbraco database.
Now it's only the Partial View that loads as it should, and this is the partial view (_EmployeeGrid is a partial inside another partial view).
@model IEnumerable<Neoweb.Models.EmployeeViewModel>
<div id="divPartialView" style="margin-top: 20px">
@Html.Partial("_EmployeeGrid", Model) <!-- Loading db table as it should -->
<div class="pagination-container pagination">
<input type="button" id="Previous" value="Previous">
<input type="button" id="Next" value="Next">
</div>
@using (Ajax.BeginForm("Employees", "HikingDestinationSurface", null, new AjaxOptions
{
HttpMethod = "POST",
OnSuccess = "Success()",
OnFailure = "Failure()",
InsertionMode = InsertionMode.Replace,
UpdateTargetId = "divPartialView"
}))
{
@Html.AntiForgeryToken()
<input type="hidden" id="currPage" name="currPage" value="@ViewBag.currPage">
<input type="hidden" id="lastPage" name="lastPage" value="@ViewBag.lastPage">
}
</div> <!-- End of divPartialView -->
<script type="text/javascript">
$(document).ready(function () {
$('#Previous').click(function () {
if (CalculateAndSetPage("Previous"))
$("form").submit();
});
$('#Next').click(function () {
if (CalculateAndSetPage("Next"))
$("form").submit();
});
});
function CalculateAndSetPage(movingType) {
var currPage = parseInt($('#currPage').val());
var lastPage = parseInt($('#lastPage').val());
if (currPage === 1 && movingType === "Previous") return false;
if (currPage === lastPage && movingType === "Next") return false;
if (movingType === "Previous") { currPage--; }
else if (movingType === "Next") { currPage++; }
else alert("Something is wrong.");
$('#currPage').val(currPage);
return true;
}
</script>
OnSuccess only run the first page after "Next" button clicked (and the paging from dbtable works without loading the whole page, like it should), and either OnSuccess or OnFailure don't run at all after second click.
Instead I've got this JavaScript error: Uncaught ReferenceError:Sys is not defined at HTMLFormElement.onsubmit, and input type="hidden" currPage didn't update it's value.
So, why isn't JavaScript / jQuery loaded after first submit?
unobtrusive-ajax fetches the whole page, not just partial view
Someone who has an Umbraco AJAX example using paging in a table where only partial view is updated - not the whole page?
I've started an attempt from this https://www.youtube.com/watch?v=sfuucXwJ-eM (Paging using Ajax form and Partial Views in MVC5 Code First Entity) rewritten from Entity to Petapoco database with custom table added to original Umbraco database.
I've also reviewed the techniques here: http://www.codeshare.co.uk/blog/how-to-change-a-form-in-mvc-to-submit-with-ajax/ (how to change a form in MVC to submit with AJAX), but the entire page is added to where only partial view should have been updated - although no additional HTML tags are added.
Now it's only the Partial View that loads as it should, and this is the partial view (_EmployeeGrid is a partial inside another partial view).
OnSuccess only run the first page after "Next" button clicked (and the paging from dbtable works without loading the whole page, like it should), and either OnSuccess or OnFailure don't run at all after second click.
Instead I've got this JavaScript error:
Uncaught ReferenceError:Sys is not defined at HTMLFormElement.onsubmit, and input type="hidden" currPage didn't update it's value.So, why isn't JavaScript / jQuery loaded after first submit?
I've now activated web.config with these:
instead of these (in my template):
the JavaScript error disappeared, and unobtrusive ajax updating now works as it should.
I also use these in my template (jquery.unobtrusive-ajax.min.js in Umbraco_Client folder didn't work):
is working on a reply...