I have jquery.dirtyforms configured on all the forms in my site. It works fine when the form is dirty and I try for example to close the page. But it doesn't work at all with an unobtrusive ajax call. (Ajax.ActionLink), the call just proceeds like normal.
Any ideas?
CODE:
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Create</title>
<script src="~/Scripts/jquery-2.2.1.js"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>
<script src="~/Scripts/jquery.dirtyforms.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('form').dirtyForms();
})
</script>
</head>
<body>
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div id="update">
<div class="form-horizontal">
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="form-group">
@Html.LabelFor(model => model.title, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.title, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.title, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Create" class="btn btn-default" />
</div>
</div>
</div>
</div>
}
<div>
@Html.ActionLink("Back to List", "Index")
@Ajax.ActionLink("Back to List", "Index", new AjaxOptions {UpdateTargetId = "update"})
</div>
</body>
</html>
When the form is dirty, the Html.ActionLink triggers the Stay/Leave pop-up, but the Ajax.ActionLink just proceeds and loads the Index View in the desired div. What I am trying to achieve is to trigger the dirtyforms pop-up also when clicking the Ajax.ActionLink.