Passing dynamic Id to AjaxActionLink ASP.NET MVC 5

Question

I have ajax action link in my view :

@Ajax.ActionLink("ShowWithFilter", 
                 "ShowCompanyData", 
                 null, 
                 new { StateId = "x", CityId = "y" },
                 new AjaxOptions
                 {
                    HttpMethod = "GET", // HttpMethod to use, GET or POST
                    UpdateTargetId = "PartialView", // ID of the HTML element to update
                    InsertionMode = InsertionMode.Replace, // Replace the existing contents
                    OnBegin = "setParameters",

                 }, new { id = "linkFilter" }
                 )

i have drop down control on my page. User can select dropdown and after clicks on ajax link above and parameter from dropdown should be sent to controller action.

in my javascrip file i have:

$("#linkFilter").click(function (e) { 
    if ($("#ddState").prop("disabled", false)) {   
        $('#linkFilter').attr('href', function () {      
            return this.href.replace('x', $('#ddState').val());
        });
    }
    else if ($("#ddCity").prop("disabled", false)) {
        return this.href.replace('y', $('#ddCity').val());
    }

});

on click i want to add parameter to ajax action link. So click event is recognized so this is ok but "return this.href.replace('x', $('#ddState').val());" this line of code says "cannot read property replace of undefined". Help please :/

score 1 · Accepted Answer · answered Aug 21 '14 at 23:19

You would be be far better off doing this with jQuery rather than @Ajax.ActionLink.

The statement if ($("#ddState").prop("disabled", false)) makes no sense since this sets the attribute disabled to false and always returns true. Since its not clear what your trying to do with this statement, I have assumed you want to send one or other of the values to your controller.

Change the linkFilter element to a button or other element (which could be style to look like a link if that what you want)

$("#linkFilter").click(function (e) {
  var url = '@Url.Action("ShowCompanyData")';
  // set defaults
  var stateID = null;
  var cityID = null;
  // set value based on disabled state of the dropdowns
  if ($("#ddState").is(':disabled')) {
    cityID = $("#ddState").val();
  } else if ($("#ddState").is(':disabled')) {
    stateID = $("#ddState").val();
  }
  $.get(url, {StateId: '', CityId: ''}, function (data) {
    // update view
    $('#PartialView').html(data);
  })
});

yes i did something like this and got it to work... tanks :) but still, i can't figure it out why "cannot read property replace of undefined" was present when I used ajax action link :/ still, thanks again — user3697231, Aug 22 '14 at 16:40

Passing dynamic Id to AjaxActionLink ASP.NET MVC 5

1 Answers1