I want to load a partial view using Ajax.PartialView() .But while trying so the Partial view is not loading at all.It is hitting AccountController.Login(),but not rendering the Login page Here is my code .

I want to load Login Page in "formbody" div without refreshing Index page . Please give suggestion on it.

Home\Index.cshtml

@{
   ViewBag.Title = "Home Page";
 }
@using(Ajax.BeginForm(

    new AjaxOptions
    {
        HttpMethod="GET",
        InsertionMode=InsertionMode.Replace,
        UpdateTargetId = "formbody"
    }
))
{
     <div class="pager glyphicon-align-center" id="formbody">            

             <button type="button" id="login" class="btn btn-default btn-lg">
                 @Ajax.ActionLink("Login", "Login", "Account", new { id = "login" }, new AjaxOptions { })
                 <span class="glyphicon glyphicon-log-in"> </span> @*Login*@
             </button>
         <button type="button" class="btn btn-default btn-lg" onclick="location.href='@Url.Action("Register", "Account", new { id = "Registerlink" })'">

         </button>

    </div >
}    
@section scripts {
@*<script src="/Scripts/jquery-1.8.2.js"></script>*@
@Scripts.Render("~/Scripts/jquery.unobtrusive-ajax.min.js")
<script type="text/javascript">
    $("#login").click(function () {
        $(".nav-tabs").html("<li> <a href='#Tab1'> Login</a></li>");
    });

</script>

}

AccountController.Login

 [AllowAnonymous]
    public ActionResult Login(string returnUrl)
    {
        ViewBag.ReturnUrl = returnUrl;
        bool req = Request.IsAjaxRequest();
        if (Request.IsAjaxRequest())
        {
            return PartialView("Login");
        }
        return View();
    }

BundleConfig

 bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                    "~/Scripts/jquery-{version}.js",
                    "~/Scripts/MicrosoftMvcAjax.js",
                    "~/Scripts/MicrosoftAjax"));

Related posts

Recent Viewed