Passing selected item of DropDownList to ajaxy called action

Question

I need to pass the value of on of the selected item in the list to the action in ajaxy way:

View:

<%= Html.DropDownList("ApplicationColumns", applicationColumns, new { @style = "width: 200px;" })%>
<%= Ajax.ActionLink("AddColumnToTrim", "AddColumnToTrim", new { columnName = ??? }, new AjaxOptions() { UpdateTargetId = "columnsDiv" })%>
<div id="columnsDiv"></div>

I'm doing this cause I cannot post the whole form and just need to execute some logic depending on the chosen item and display it in partial view. How can I pass the value(or selected SelectListItem) of the selected item of the DropDownList to my action please ? Thank you.

score 0 · Accepted Answer · edited May 23 '17 at 11:48

Using a form would be the semantically correct way to do this:

<% using (Ajax.BeginForm("AddColumnToTrim", "SomeController", new AjaxOptions { UpdateTargetId = "columnsDiv" })) { %>
    <%= Html.DropDownList("ApplicationColumns", applicationColumns, new { @style = "width: 200px;" })%>
    <button type="submit">AddColumnToTrim</button>
<% } %>

Now the selected value of the dropdown will be automatically sent to the controller action using an AJAX call when this form is submitted:

public ActionResult AddColumnToTrim(string ApplicationColumns)
{
    ...
}

And, yes, you could style this button to look like an anchor.

Passing selected item of DropDownList to ajaxy called action

1 Answers1