How to change link text from jquery function on click event

Question

I stuck in very simple situation.
I have a link that execute ajax call and on success I need to change clicked link text or color.

foreach (var m in Model.GroupPosts){
...
@Html.ActionLink("Vote up", "Vote", "GroupPost", new { groupPostId = m.GroupPostId }, new{@class="vote-up"})
                @Html.ActionLink("Vote down", "Vote", "GroupPost", new { groupPostId = m.GroupPostId }, new { @class = "vote-down" })
}

$('.vote-up').click(function (e) {
            e.preventDefault();
            var url = $(this).attr('href');
            $.ajax({
                url: url,
                type: "GET",
                success: function (html) {
                    alert("voted up");
                    e.target.text("New link text");
                }
            });
        });

I can't change clicked link text.

The Alpha · Accepted Answer · 2014-06-08 16:34:22Z

2

It should be:

$(e.target).text("New link text");

Also you may keep a reference of the clicked button/Link outside of the AJAX call and then you may use it inside your success callback; like this:

$('.vote-up').click(function (e) {
    e.preventDefault();
    var url = $(this).attr('href'),
    btn = $(this); // <-- reference the Button/Link
    $.ajax({
        url: url,
        type: "GET",
        success: function (html) {
            alert("voted up");
            btn.text("New link text"); // <-- Use that referenced jQuery Object
        }
    });
});

edited Jun 8, 2014 at 16:34

answered Jun 8, 2014 at 16:28

The Alpha

147k30 gold badges294 silver badges313 bronze badges

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

Comments

Mister Epic · Accepted Answer · 2014-06-08 16:30:33Z

0

And the pure javascript way:

 e.target.innerHTML = "New link text"

e.target is an element, not a jQuery object, so it doesn't have the text() method you are attempting to use. You can either use the element's innerHTML property, or wrap the element in jQuery to give you access to text() as WereWolf demonstrates.

answered Jun 8, 2014 at 16:30

Mister Epic

16.8k13 gold badges88 silver badges156 bronze badges

Collectives™ on Stack Overflow

How to change link text from jquery function on click event

2 Answers 2

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Related