Using Ajax in .Net MVC 2

Question

Okay, so right now I'm trying to call an Ajax function from a normal text link, however I cannot get it to work properly(or at all). If I call it form a button, it will work fine.

Essentially I'm trying to reorder the items in a table.

how can I call Ajax from an ActionLink or Ajax?

Here is the script that works fine when called from a button:

<script type="text/javascript">

        $(document).ready(function() {

            $(".Name").click(function() {
                $.ajax({
                    url: '<%= Url.Action("MyAction") %>',
                    dataType: 'html',
                    success: function(result) { $("#tableToUpdate").html(result); }
                });
            });
        });
</script>

Darin Dimitrov · Accepted Answer · 2011-06-16 19:26:38Z

4

You need to cancel the default action of the anchor by returning false from the click handler;

$(".Name").click(function() {
    $.ajax({
        url: '<%= Url.Action("MyAction") %>',
        dataType: 'html',
        success: function(result) { 
            $("#tableToUpdate").html(result); 
        }
    });
    return false; // <-- that's important
});

But I would probably directly use the href of the link:

<%= Html.ActionLink("Foo", "MyAction", null, new { @class = "Name" }) %>

which I would unobtrusively AJAXify in a separate javascript file (progressive enhancement):

$(function() {
    $('.Name').click(function() {
        $('#tableToUpdate').load(this.href);
        return false;
    });
});

edited Jun 16, 2011 at 19:26

answered Jun 16, 2011 at 19:19

Darin Dimitrov

1.0m276 gold badges3.3k silver badges3k bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Darin Dimitrov Over a year ago

@Tassadaque, no, that's bad from SEO perspective as it makes your site uncrawlerable. Progressive enhancement with javascript is a much better technique.

James Over a year ago

perfect, thanks! I didnt realize I had to alter the script! Will accept when I am allowed to(5 min. from now)

Tassadaque · Accepted Answer · 2011-06-16 19:19:32Z

1

Have u looked at the ajax.actionlink

<%= Ajax.ActionLink("Update Status", "GetStatus", new AjaxOptions{UpdateTargetId="status" }) %>

answered Jun 16, 2011 at 19:19

Tassadaque

8,19715 gold badges59 silver badges92 bronze badges

Collectives™ on Stack Overflow

Using Ajax in .Net MVC 2

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related