user1977591 user1977591 - 4 months ago 13
Ajax Question

How can I hide my ajax action link after it is clicked?

I am using asp.net mvc 3. I have this code on my view.

<%
foreach(Team t in Model.AvailableTeams.AvailableTeams)
{ %>
<%= Ajax.ActionLink(t.Title
, "InviteTeamToChallenge"
, "Challenge"
, new{id = t.TeamId
, challengeId = Model.ChallengeId
, teamId = t.TeamId
, invitedByUserId = Model.userId}
, new AjaxOptions
{
OnSuccess = "hideLabel(teamId)"
} ) %>
<% } %>


i am trying to pass the teamId in anyway possible to a javascript function that can then hide the action link after it has been clicked. Right now, the javascript method is not getting called. here is my javascript:

function hideLabel(teamId) {
alert("in JS");
alert(teamId);
$('.teamId').hide();
}


I would also like to refresh a partial view on the page that lists teams that have been selected, but that is another problem to deal with after i get this piece.

Answer

You need to set unique id for each action link:

new AjaxOptions
                     {
                          OnSuccess = "hideLabel(" + t.TeamId + ")"       
                     },
new { id="actionLink" + t.TeamId  )

and than

function hideLabel(teamId) {
          $('#actionLink' + teamId).hide();
       }