Use @ Ajax.ActionLink to open a form

Question

I want to use @ Ajax.ActionLink to pop up a form, so I did this on my cshtml page:

@Ajax.ActionLink("click ", "AddToMembers", new AjaxOptions { HttpMethod = "GET", UpdateTargetId = "result", InsertionMode = InsertionMode.Replace, OnSuccess = "openPopup" }) <div id="result" style="display:none;"></div> 

and add this script:

  <script type="text/javascript"> $(document).ready(function () { $("#result").dialog({ autoOpen: false, title: 'Title', width: 500, height: 'auto', modal: true }); }); function openPopup() { $("#result").dialog("open"); } </script> 

in my controller this function is added:

  [HttpGet] public PartialViewResult AddToMembers() { return PartialView(); } 

but when I click on "click", a new page opens in my browser in my form. not in my popup form what is the problem ???

Answer 1

I suspect that you forgot to include the following script page in your page:

 <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script> 

This script is used for the AJAXify anchor generated by the Ajax.ActionLink . Also, you are using the jQuery dialog, make sure you specify the jQuery UI:

 <script src="@Url.Content("~/Scripts/jquery-ui-1.8.11.js")" type="text/javascript"></script>