The model directive may only occur once per document (adding buttons to lists problem) ASP.NET MVC Core C#

Question

I'm trying to display a button because I need to add new information but there is a list within the file and it is not working

I am using ASP.NET Core MVC and C#.

It is something like this:

HTML File:

@model IEnumerable<MyApplication.Models.Clients>


<table class="table" id="Tabla4">
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.CODE)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.NAME)
            </th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => item.CODE)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.NAME)
                </td>
                <td>
                </td>
            </tr>
        }
    </tbody>
</table>

My controller method:

public ActionResult Create()
{
    List<Clients> clients = dbContext.GetClients().ToList();
    return View(clients);
}

I want to add this in my HTML file:

<div class="row">
    <div class="col-md-4">
        <form asp-action="Create">
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
            <div class="form-group">
                <label asp-for="CODE" class="control-label"></label>
                <input asp-for="CODE" class="form-control" />
                <span asp-validation-for="CODE" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="NAME" class="control-label"></label>
                <input asp-for="NAME" class="form-control" />
                <span asp-validation-for="NAME" class="text-danger"></span>
            </div>
            <div class="form-group">
                <input type="submit" value="Create" class="btn btn-primary" />
            </div>
        </form>
    </div>
</div>

I tried to add this:

@Model MyApplication.Models.Clients

I get this error:

The model directive may only occur once per document

How can I solve it?

EDIT:

My Client Model is this:

public class Clients{
 public int CODE {get; set;}
public string NAME {get; set;}

}

If i put the button inside the HTML File it throws and error:

   @model IEnumerable<MyApplication.Models.Clients>
    
    
    <table class="table" id="Tabla4">
        <thead>
            <tr>
                <th>
                    @Html.DisplayNameFor(model => model.CODE)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.NAME)
                </th>
                <th></th>
            </tr>
        </thead>
        <tbody>
            @foreach (var item in Model)
            {
                <tr>
                    <td>
                        @Html.DisplayFor(modelItem => item.CODE)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.NAME)
                    </td>
                    <td>
                    </td>
                </tr>
            }
        </tbody>
    </table>
    
    
        <div class="row">
        <div class="col-md-4">
            <form asp-action="Create">
                <div asp-validation-summary="ModelOnly" class="text-danger"></div>
                <div class="form-group">
                    <label asp-for="CODE" class="control-label"></label>
                    <input asp-for="CODE" class="form-control" />
                    <span asp-validation-for="CODE" class="text-danger"></span>
                </div>
                <div class="form-group">
                    <label asp-for="NAME" class="control-label"></label>
                    <input asp-for="NAME" class="form-control" />
                    <span asp-validation-for="NAME" class="text-danger"></span>
                </div>
                <div class="form-group">
                    <input type="submit" value="Create" class="btn btn-primary" />
                </div>
            </form>
        </div>
    </div>

It says:

IEnumerable<MyApplication.Models.Clients> does not contain a definition CODE and no accesible extension method CODE

IEnumerable<MyApplication.Models.Clients> does not contain a definition NAME and no accesible extension method NAME

EDIT #2

<div class="row">
    <div class="col-md-4">
        <form asp-action="Create">
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
            <div class="form-group">
                <label for="CODE" class="control-label"></label>
                <input name="CODE" class="form-control" />
            </div>
            <div class="form-group">
                <label for="NAME" class="control-label"></label>
                <input name="NAME" class="form-control" />
            </div>
            <div class="form-group">
                <input type="submit" value="Create" class="btn btn-primary" />
            </div>
        </form>
    </div>
</div>

EDIT #3:

Now it is throwing this error: Object reference not set to an instance of an object, in the foreach part:

@model IEnumerable<MyApplication.Models.Clients>

<div class="row">
    <div class="col-md-4">
        <form asp-action="Create" method="post">
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
            <div class="form-group">
                <label for="CODE" class="control-label">Code:</label>
                <input name="CODE" class="form-control" />
            </div>
            <div class="form-group">
                <label for="NAME" class="control-label">Name:</label>
                <input name="NAME" class="form-control" />
            </div>
            <div class="form-group">
                <input type="submit" value="Insert" class="btn btn-primary" />
            </div>
        </form>
    </div>
</div>

<table class="table" id="Tabla4">
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.CODE)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.NAME)
            </th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => item.CODE)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.NAME)
                </td>
                <td>
                </td>
            </tr>
        }
    </tbody>
</table>

Image: [![image][1]][1]

This is my Controller Create HTTP METHOD:

public ActionResult Create([Bind] Clients clients)
{
    try
    {
        if (ModelState.IsValid)
        {
            dbContext.InsertData(clients);
            return RedirectToAction("Index");
        }
        return View(clients);
    }
    catch
    {
        return View();
    }
}

If you're using ASP.NET **Core** MVC - please use the `asp.net-core-mvc` tag to make this clear! — marc_s, Feb 28 '21 at 17:37
Why do you want to place two `@Model` lines in your view? What type is the model in your document/view? — Progman, Feb 28 '21 at 17:39
@Progman what do you mean by "type", My Clients model contains 2 things: CODE and NAME — JustToKnow, Feb 28 '21 at 17:45
@programming_amazing I mean the type of the model you are calling the document/view with. You can use only one `@Model ...` line (most likely near/at the top) to indicate something like: "This document/view use a model of the type `YourChoosenType`". Using two `@Model` lines doesn't make sense because there is only one value and you get the error message as expected if you add two `@Model` lines. — Progman, Feb 28 '21 at 17:48
@Progman I wanted to display a list and a button to trigger an event in controller file . I need the list because i will create the tuple based on the data shown in that list. Do you get me? — JustToKnow, Feb 28 '21 at 17:52
@programming_amazing Then the line `@Model IEnumerable` or even `@Model IList` is correct, as that is the value you are using in the `return View(clients);` line. Delete the `@Model MyApplication.Models.Clients` line to get rid of the error message "The model directive may only occur once per document". — Progman, Feb 28 '21 at 17:56
@Progman take a look, pal. I have edited the question. If i delete Model MyApplication.Models.Clients and try to add the button, it throws an error — JustToKnow, Feb 28 '21 at 18:04

score 1 · Accepted Answer · answered Feb 28 '21 at 18:16

1

You cannot use asp-for="..." when the model/value you are using does not have these properties. Your model is defined as IEnumerable<MyApplication.Models.Clients> as the value for the view is a List<MyApplication.Models.Clients> object. When you use <input asp-for="CODE"> it looks for a property CODE inside the IEnumerable<...> type. However, this interface does not have such a property.

In your case you don't need asp-for="". Instead you can use a "normal" <input> tag with the name="..." attribute you want, depending on the Create() action you have defined. The code can look like this:

<div class="form-group">
    <label for="CODE" class="control-label">Code:</label>
    <input name="CODE" class="form-control" />
</div>

That way the HTTP Request will have the field name CODE in the POST body or GET URL parameter list, depending on how you send the form. ASP.NET will automatically fill the values into the parameters of your Create() action for you.

answered Feb 28 '21 at 18:16

Progman

16,827
6
33
48

Thank you very much for replying, pal. It does make sense to me – JustToKnow Feb 28 '21 at 18:19
Take a look, i have edited my question. It should trigger the Create [HTTP POST] method in the controller file, right? – JustToKnow Feb 28 '21 at 18:22
I believe you need the `method="post"` attribute to send a `POST` request. Otherwise it would be a `GET` request. – Progman Feb 28 '21 at 18:29
I do not fully understand that: isnt it performing a POST REQUEST by just using
? Should i edit that and put something like this:
?
– JustToKnow Feb 28 '21 at 18:40
@programming_amazing Yes. You can check the generated source code in your browser and should see something like `
...
`. That way a POST request is send. – Progman Feb 28 '21 at 18:42
Getting rid of asp-action="Create" does not mean it wont trigger the Create HTTP POST in Controller? – JustToKnow Feb 28 '21 at 18:45
@programming_amazing Check https://learn.microsoft.com/en-us/aspnet/core/mvc/views/working-with-forms?view=aspnetcore-5.0#the-form-tag-helper on how the form tag helper supports you in creating HTML forms. When you don't have `asp-action="..."` or `action="..."` in your `
` tag, your browser will not know where to send the form to (or maybe send it to the current URL instead).
– Progman Feb 28 '21 at 18:49
Take a look, there exist a new error. I have edited my question. – JustToKnow Feb 28 '21 at 19:03
@programming_amazing That would be a different problem/question, but the problem with NullReferenceExceptions is explained in https://stackoverflow.com/questions/4660142/what-is-a-nullreferenceexception-and-how-do-i-fix-it – Progman Feb 28 '21 at 19:05

The model directive may only occur once per document (adding buttons to lists problem) ASP.NET MVC Core C#

1 Answers1