CODEWITHSUNDEEP
javascriptjqueryajaxasp.net-mvc
Ali Hamadi
Ali Hamadi

Reputation: 683

ajax.actionlink(){} is reloading the page instead of calling ajax

i am trying to call an ajax action instead of reloading the page but something doesn't seems to be working here is my index where i implement the ajax.action method 

@model IEnumerable<MessagingProject.Models.chating>  
@{
    ViewBag.Title = "Index";
}
<h2>Index</h2>
<p>
    @Ajax.ActionLink("Info", "info","Chat", new AjaxOptions
       {
           UpdateTargetId = "AliHamadi",
           InsertionMode = InsertionMode.Replace,
           HttpMethod = "get"
       })
    @Html.ActionLink("Create New", "Create")
</p>
<table >
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.sending)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.reciving)
        </th>
        <th></th>
    </tr>  
@foreach (var item in Model) {
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.sending)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.reciving)
        </td>
        <td>

            @Html.ActionLink("Info", "info", new {ID=item.id }) |

            @Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })
        </td>
    </tr>
}   
</table>
<div id="AliHamadi">
</div>

and here is my action info action method 

public PartialViewResult info()
            {
                var model = messageContext.messages.Select(r => r.name == "ali").Single();
                return PartialView("info",model);
            }

and here is my layout view where i implement my jquery scripts

<!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8" />
        <title>@ViewBag.Title</title>
        <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />


    </head>
    <body>
        <ul id="menu">
            <li>@Html.ActionLink("Home", "Index", "Home")</li>
            <li>@Html.ActionLink("Chatting", "Index", "Chat")</li>
            <li>@Html.ActionLink("About", "About", "Home")</li>
        </ul>
        <section id="main">
            @RenderBody()
            <p>Copyright W3schools 2012. All Rights Reserved.</p>
        </section>
           @* @Content.Script("jquery-2.1.1.min.js", Url) *@
        <script src="~/Scripts/jquery-2.1.1.js"></script>
        <script src="~/Scripts/jquery-2.1.1.min.js"></script>
    </body>     
</html>

i get the whole page reloading instead of calling the info method and implement it in the index view

Upvotes: 3

Views: 916

Answers (1)

Ali Hamadi
Ali Hamadi

Reputation: 683

Yes Stephen i actually forgot to include the unobtrusive.js in my project. Thank you for mention it.

Kind Regards.

Upvotes: 3

Related Questions