How to represent "list" of user input in MVC model?

Question

I need to allow my user to fill out a form and then click an 'Add' button. Then, a row in a table is populated with their input values. They also have the option to click an 'x' to remove the row if they change their mind.

Here is what it looks like:

This all works, but I have no idea how to represent the form values in the model. Can I make something like a struct of the values and then just add them into an array? How would I do that?

Also, here is my code: (I'm populating these DropDownLists in typescript and adding a listener to add the selected value to the hiddenfor element which is the actual element hooked up to the model)

<div class="col-sm-6">
    <div class="field col-sm-12">
        @Html.HiddenFor(x => x..CallType, new { id = "CallType-List_Value" })

        @Html.DropDownList("CallType", new SelectList(" "), new { @class = "CallType-List form-control" })
        @Html.ValidationMessageFor(x => x.CallType, "", new { @class = "text-danger" })
        @Html.LabelFor(x => x.CallType)
    </div>
    <div class="field  col-sm-12">
        @Html.HiddenFor(x => x.CallSubType, new { id = "CallSubType-List_Value" })

        @Html.DropDownList("CallSubType", new SelectList(" "), new { @class = "CallSubType-List form-control" })
        @Html.ValidationMessageFor(x => x.CallSubType, "", new { @class = "text-danger" })
        @Html.LabelFor(x => x.CallSubType)
    </div>
    <div class="field  col-sm-12">
        <div class="field">
            @Html.EditorFor(x => x.AccountNumber, new { htmlAttributes = new { placeholder = " " } })
            @Html.LabelFor(x => x.AccountNumber)
            @Html.ValidationMessageFor(x => x.AccountNumber, "", new { @class = "text-danger" })
        </div>
    </div>
</div>
<div class="small-btn col-sm-12" style="border-top: none !important;">
    <button type="button" class="btn btn-primary">ADD INCIDENT</button>
</div>

And the model so far:

public string CallType { get; set; }

public string CallSubType { get; set; }

[RegularExpression(@"^[0-9]*$", ErrorMessage = "Account number is not valid.")]
[StringLength(16, ErrorMessage = "Account number cannot be longer than 15 characters.")]
public int AccountNumber { get; set; }

I'm super new to .NET, so please forgive me if the answer is obvious.

Dmitry · Accepted Answer · 2020-06-11 10:20:36Z

Set values to DropDownList you need a IEnumrable of values CallType:

// List of types
var callTypes =  new List<string>{"CallType1", "CallType2" };

// View list view data from Model
@Html.DropDownList("CallType", new SelectList(callTypes, Model.CallType), new { @class = "CallType-List form-control" })

Constructor of SelectList need first parametrs a list of values, second what need to select in list

If you want different DisplayTitle and Value for view DropDownList, you can use this code:

// class for describe view sub types
public class CallSubTypesView
{
  public string Id { get; set; }
  public string Name { get; set; }
}

And in view:

@{

var list = new[] {
    new CallSubTypesView { Id = "1", Name = "Name1" },
    new CallSubTypesView { Id = "2", Name = "Name2" },
    new CallSubTypesView { Id = "3", Name = "Name3" }
};

    var selectList = new SelectList(list, "Id", "Name", Model.CallSubType);
}

@Html.DropDownList("CallSubType", selectList, new { @class = "CallSubType-List form-control" })

In the post request of this form parameter CallSubType has value as CallSubTypesView.Id ("1" or "2" or "3"), not Name

Collectives™ on Stack Overflow

How to represent "list" of user input in MVC model?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related