0

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)
    {

        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"));
user3347332
  • 1
  • 2
  • Please narrow down your sample code. It's hard to tell which AJAX action you intend to interact with your Login action. Also, see [here](http://stackoverflow.com/questions/8782697/are-microsoftajax-js-microsoftmvcajax-js-and-microsoftmvcvalidation-js-obsolete) and check your included javascript files. – Jasen Aug 23 '14 at 21:23
  • 2
    I believe you only need jquery and `jquery.unobtrusive-ajax.js` now and you can drop the other Microsoft*.js scripts. – Jasen Aug 23 '14 at 21:32
  • There is so much wrong with your code its hard to know where to start. The immediate problem is you are not setting any of the options in `@Ajax.ActionLink(..), new AjaxOptions { })` in particular `UpdateTargetId`, but your also going to be rendering nested forms and there are duplicate `id` issues. I suggest you dump the `@Ajax` methods and use jquery. –  Aug 24 '14 at 23:37
  • I prefer to use an ajax call instead of an ajax form. See my answer here http://stackoverflow.com/questions/21919446/ajax-form-within-ajax-form/21919903#21919903 – Matt Bodily Aug 25 '14 at 13:44

0 Answers0