Question

I have a class that looks like this:

public class UserListVM
{
    public SearchModel SearchModel { get; set; }
    public PagedList<User> Users { get; set; }
}

public class SearchModel
{
    public string Text { get; set; }
    /* other properties */
}

I send UserListVM to my view but the action accepts SearchModel:

public ActionResult Search(SearchModel filter)
{
        UserListVM model = new UserListVM();

        model.Users = userService.GetUsers(filter);
        model.SearchModel = filter;

        return View(model);
}

My view is:

@model UserListVM 

<form>
    @Html.TextBoxFor(m => Model.SearchModel.Text)
</form>

But this generates:

<input id="SearchModel_Text" name="SearchModel.Text" type="text" value="">

Which sends UserListVM to the action instead of SearchModel. How can I get it to generate this:

<input id="Text" name="Text" type="text" value="">

Answer 1

@Html.TextBoxFor(m => m.SearchModel.Text, new { id = "Text" })

Utilize the overloaded TextBoxFor() method that takes a second object parameter (called htmlAttributes). Here you can specify HTML attributes to apply to the DOM element you are currently utilizing (in this case, your input element).

Edit: I believe your lambda expression is wrong. Change:

@Html.TextBoxFor(m => Model.SearchModel.Text)

To

@Html.TextBoxFor(m => m.SearchModel.Text)
// htmlAttributes omitted to show the issue

Edit Edit: it turns out that even with a specified name attribute, it will be rendered according to what the form is requiring for a POST to the necessary field(s).

Edit Edit Edit: Try to be explicit with FormExtensions.BeginForm():

@using (Html.BeginForm("Search", "YourController", FormMethod.Post, null))
{
    @Html.TextBoxFor(m => m.SearchModel.Text)
}

Use this as a substite of your <form /> element.