-1

I am trying to generate a unique label and and input text box for a partial view that is being used to render a list of user input rows.

By unique I mean that each input text box should have its unique html "id" and "name" so that when is submitted each input can be identified

In the View I have

@model UserDataModel

@{
    var inpName = "benefName" + @Model.Row;
    var inpAge = "benefAge" + @Model.Row;
}
@Html.LabelFor(x => x.Name, new { @class="labelhalf"})
@Html.EditorFor(x => x.Name, new { id = @inpName, htmlAttributes = new { @class = "form-control animated" } })

When the view is being render this is what I am seeing

<label class="labelhalf" for="Name">Nombre (Opcional)</label>
<input class="text-box single-line" id="Name" name="Name" type="text" value="">

As you can see the "name" and "id" attributes of the text input is "Name" and "Name" and is not using the value of the @inpName variable ("benefName1" for example)

Also I am trying to assign some CSS classes to that same input using "htmlAttributes"

I had previously tried this with this approach

<label form="FormStep_01" for=@inpName class="labelhalf">Nombre (Opcional)</label>
<input form="FormStep_01" id=@inpName class="form-control animated" pattern="^[_A-z0-9]{1,}$" type="text" placeholder="" required="">

...but the content of the input fields with this approach are not being submited and that is the reason I am trying to use the @Html.EditorFor

UPDATE I am now using the TextBoxFor which takes the "id" and the "class" fine but not the "name" which is used in the submit

@Html.LabelFor(x => x.Name, new { @class = "labelhalf" })
@Html.TextBoxFor(x => x.Name, new { @id = @inpName, name = @inpName, @class = "form-control animated" })

Please let me know how to achieve this in MVC4

Mauricio Gracia Gutierrez
  • 10,288
  • 6
  • 68
  • 99
  • You cannot add `HmlAttributes` using `EditorFor()` in MVC-4. You need at least `MVC-5.1` (refer [mvc 5.1 whats new](https://www.google.com.au/webhp?sourceid=chrome-instant&ion=1&espv=2&ie=UTF-8#q=mvc%205.1%20whats%20new). But more importantly you should **never** try to override the `name` (or `value`) attributes set by the HtmlHelper (its the surest way to ensure your app fails) and the MVC built in safe guards to prevent you changing the `name` attribute. There is a workaround (but I wont tell you that) but you may as well just create the inputs manually. –  Feb 05 '16 at 00:10
  • You appear to have the classic [XY problem](http://meta.stackexchange.com/questions/66377/what-is-the-xy-problem). My best guess is you want to dynamically generate inputs for items in a collection property of a model, in which case I suggest you study the answers [here](http://stackoverflow.com/questions/29161481/post-a-form-array-without-successful/29161796#29161796) and [here](http://stackoverflow.com/questions/28019793/submit-same-partial-view-called-multiple-times-data-to-controller/28081308#28081308) –  Feb 05 '16 at 00:11
  • @StephenMuecke when I created the inputs manually they were not being used in the submit (as I mentioned in my question) – Mauricio Gracia Gutierrez Feb 05 '16 at 10:21
  • Sorry, don't understand your last comment at all (and there is nothing in you question about manually creating them. –  Feb 05 '16 at 10:24
  • @StephenMuecke yes there is look for text "I had previously tried this with this approach" and read on. – Mauricio Gracia Gutierrez Feb 05 '16 at 14:28
  • 1
    But you did not give the input a `name` attribute (so of course its not posted).` And why are you wanting to give them `id` attributes - what javascript are you using? Hopefully you have been through all 3 links I gave you previously. –  Feb 05 '16 at 20:39
  • @StephenMuecke i did got through the links and at the moment I did not realize that the name was not being used. Been working many hours in a row which produces this kind of dumb mistakes. Any how if you post that as an answer I could accept it. thanks – Mauricio Gracia Gutierrez Feb 06 '16 at 13:37

1 Answers1

1

Issue 1 (Using EditorFor())

You cannot add html attributes using EditorFor() in MVC-4. This feature was not introduced until MVC-5.1, and then the correct usage is

@Html.EditorFor(m => m.SomeProperty, new { htmlAttributes = new { someAttribute = "someValue" }, })

Issue 2 (Using TextBoxFor())

You cannot change the value of the name attribute using new { name = "someValue" }. The MVC team built in a safe guard to prevent this because the whole purpose of using the HtmlHelper methods to generate form controls is to bind to your model properties, and doing this would cause binding to fail. While there is a workaround, if you do discover it, don't do it! As a side note - the following line of the private static MvcHtmlString InputHelper() method in the source code

tagBuilder.MergeAttribute("name", fullName, true);

is what prevents you overriding it.

Issue 3 (Manual html)

You not giving the inputs a name attribute. A form posts back a name/value pair based on the name and value attributes of successful controls, so if there is no name attribute, nothing will be sent to the controller.

Side note: If your manually generating html, there is no real need to add an id attribute unless your referring to that element in javascript or css.

Its unclear why your trying to create a input for something that does not appear to relate to your model, but if your trying to dynamically generate items for adding items to a collection property in your model, refer the answers here and here for some options which will allow you to bind to your model.

Community
  • 1
  • 1