I'm using mvc Ajax.BeginForm to load a partial view that have a kendo ComboBox in it.
While using InsertionMode = InsertionMode.ReplaceWith at the form's AjaxOptions, everything works fine and the partial view is loaded with the kendo functionality.
However, when changing the InsertionMode to InsertionMode = InsertionMode.InsertAfter, the partial view is loaded but without the kendo functionality, and I get a simple textbox instead of the auto complete combo box.
I have checked both scenarios page source and I can see the kendo jquery script in both of them, but it seems to get fired only when using ReplaceWith.
The code I'm using:
@using (Ajax.BeginForm("AddNewPlanDetail", "Plans", new AjaxOptions
{
UpdateTargetId = "AdditionalPlanDetailsHolder",
InsertionMode = InsertionMode.InsertAfter,//<--only changed this
HttpMethod = "Post",
OnFailure = "handleAjaxError"
}))
{ ...... }
All other code (Action, partial view) stays the same.
Any ideas?
Update:
To simplify the problem I reconstructed a sample without the kendo scripts and only with simple javascript:
My View Index.chtml:
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<title></title>
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryval")
@Scripts.Render("~/bundles/unobtrusive")
</head>
<body>
<div>
@using (Ajax.BeginForm("GetPartial", "AjaxTest", new AjaxOptions
{
UpdateTargetId = "updateTargetElement",
InsertionMode = InsertionMode.InsertAfter,//<--Change this
HttpMethod = "Post"
}))
{
<h1>
Ajax Form Test
</h1>
<input type="submit" value="submit" />
}
<div id="updateTargetElement">
</div>
</div>
My Controller:
public class AjaxTestController : Controller
{
public ActionResult Index()
{
return View();
}
[HttpPost]
public ActionResult GetPartial()
{
return PartialView("Partial1");
}
}
My Partial View Partial1.chtml:
<b>This is from partial</b>
<script>
alert('Fired');
</script>
The alert script is fired but only when using InsertionMode = InsertionMode.ReplaceWith