SelectListItem does not contain a property with the name

Question

I am working on a Master-Detail form, and I have been trying for quite some time, but I can't understand the issue. When I fetch the data for editing, the data is displayed in the view fields, but there are some dropdowns here that are not populating with their values, and an error occurs stating that the property is not present. I hope you understand. I'll share the code with you.

View: _AddorEdit

@model SomeProject.Models.OrderViewModel

@using (Html.BeginForm("AddorEdit", "Quotation", FormMethod.Post, new { onsubmit = "return SubmitForm(this)" }))
{
    @Html.HiddenFor(model => model.masterQuotId, new { Id = "hiddenMasterQuotId", Name = "hiddenMasterQuotId" })
    @Html.HiddenFor(model => model.orderItemsJson, new { Id = "orderItemsJson", Name = "orderItemsJson" })
    
    if (Model.masterQuotId == 0)
    {
        <!-- New Form -->
    }
    else
    {
        <div class="form-group row">
            <div class="col-md-3">
                <label class="text-gray-700">Quotation Number</label>
                @Html.EditorFor(model => model.quotationNumber, new { htmlAttributes = new { @class = "form-control", @autocomplete = "off", @placeholder = "Quotation Number" } })
            </div>
            <div class="col-md-3">
                <label>Customer</label> @Html.ValidationMessageFor(model => model.customerName)
                @Html.DropDownListFor(model => model.customerName, new SelectList(ViewBag.CustomerNameList, "customerId", "customerName"), "-- Select Customer --", htmlAttributes: new { @class = "form-control" })
            </div>
            <div class="col-md-3">
                <label>Inco Term</label>
                @Html.DropDownListFor(model => model.incoTerm, new SelectList(ViewBag.IncoTermList, "incoTermId", "incoTerm"), "-- Select Inco Term --", htmlAttributes: new { @class = "form-control" })
            </div>
            <div class="col-md-3">
                <label>Inco Term</label>
                @Html.DropDownListFor(model => model.paymentTerm, new SelectList(ViewBag.PaymentTermList, "paymentTermId", "paymentTerm"), "-- Select Payment Term --", htmlAttributes: new { @class = "form-control" })
            </div>
        </div>
        <div class="form-group row">
            <div class="col-md-3">
                <label class="text-gray-700">Date</label>
                @Html.EditorFor(model => model.date, new { htmlAttributes = new { @class = "form-control cDate", @autocomplete = "off", @placeholder = "Date" } })
            </div>
            <div class="col-md-3">
                <label>Quote Price</label>
                <input id="quotePriceDis" type="text" class="form-control" placeholder="0.00" readonly="readonly" />
            </div>
            <div class="col-md-3">
                <label>Final Price</label>
                <input id="finalPriceDis" type="text" class="form-control" placeholder="0.00" readonly="readonly" />
            </div>
            <div class="col-md-3">
                <label>Last Sale</label>
                <input id="lastSaleDisp" type="text" class="form-control" placeholder="0.00" readonly="readonly" />
            </div>
        </div>
        <hr />
        <div class="form-group row">
            <div class="col-12">
                <!-- OrderItemViewModel Fields -->
                <table class="prodTable" id="quoteTable" border="0">
                    <thead>
                        <tr>
                            <th>Supplier</th>
                            <th>Sub Cat</th>
                            <th>Model</th>
                            <th>Price/Unit/Set</th>
                            <th>Qty</th>
                            <th>Disc %</th>
                            <th>Total</th>
                        </tr>
                    </thead>
                    <tbody>

                        @if (Model != null && Model.orderItems != null)
                        {
                            for (int i = 0; i < Model.orderItems.Count; i++)
                            {
                                if (Model.masterQuotId != 0 && i == Model.orderItems.Count - 1)
                                {
                                    <tr id="mainRow" class="mainRow">
                                        <td>
                                            @Html.DropDownListFor(model => model.orderItems[i].supplierName, new SelectList(ViewBag.SupplierNameList, "supplierId", "supplierName"), "-- Select Supplier --", htmlAttributes: new { @class = "form-control supplier", id = "supplierDropdown" })
                                            <span class="error">Required</span>
                                        </td>
                                        <td>
                                            @Html.DropDownListFor(model => model.orderItems[i].productCat, new SelectList(""), "-- Select Cat --", htmlAttributes: new { @class = "form-control productCat", id = "productCatDropdown" })
                                            <span class="error">Required</span>
                                        </td>
                                        <td>
                                            @Html.DropDownListFor(model => model.orderItems[i].productCatModel, new SelectList(""), "-- Select Model --", htmlAttributes: new { @class = "form-control productModel", id = "productCatModelDropdown" })
                                            <span class="error">Required</span>
                                        </td>
                                        <td>
                                            @Html.EditorFor(model => model.orderItems[i].unitPrice, new { htmlAttributes = new { @class = "form-control qPrice", @autocomplete = "off", @placeholder = "Unit Price", id = "unitPrice" } })
                                            <span class="error">Required</span>
                                        </td>
                                        <td>
                                            @Html.EditorFor(model => model.orderItems[i].quantity, new { htmlAttributes = new { @class = "form-control qty", @autocomplete = "off", @placeholder = "Qty", id = "qty" } })
                                            <span class="error">Required</span>
                                        </td>
                                        <td>
                                            @Html.EditorFor(model => model.orderItems[i].discount, new { htmlAttributes = new { @class = "form-control disc", @autocomplete = "off", @placeholder = "Disc", id = "discount" } })
                                            <span class="error">Required</span>
                                        </td>
                                        <td valign="top">
                                            <input type="button" class="btn-size btn btn-success btn-sm btnAddRow" value="Add" id="btnAddRow" />
                                        </td>
                                    </tr>
                                }
                            }
                        }
                        <tr>
                            <td colspan="7">
                                <center><span id="orderItemError" style="color: #ff0000;"></span></center>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
        <div id="orderDetailsContainer">

        </div>
        <table class="tableTable table-bordered table-striped" id="orderDetails" width="100%" cellspacing="0">
            <tbody>

                @if (Model != null && Model.orderItems != null)
                {

                    for (int i = 0; i < Model.orderItems.Count; i++)
                    {
                        <tr class="mainRow">
                            <td>
                                @Html.DropDownListFor(model => model.orderItems[i].supplierName, new SelectList(ViewBag.SupplierNameList, "supplierId", "supplierName"), "-- Select Supplier --", htmlAttributes: new { @class = "form-control supplier", id = "supplierDropdown" })
                            </td>
                            <td>
                                @Html.DropDownListFor(model => model.orderItems[i].productCat, new SelectList(""), "-- Select Cat --", htmlAttributes: new { @class = "form-control productCat", id = "productCatDropdown" })
                            </td>
                            <td>
                                @Html.DropDownListFor(model => model.orderItems[i].productCatModel, new SelectList(""), "-- Select Model --", htmlAttributes: new { @class = "form-control productModel", id = "productCatModelDropdown" })
                            </td>
                            <td>
                                @Html.EditorFor(model => model.orderItems[i].unitPrice, new { htmlAttributes = new { @class = "form-control qPrice", @autocomplete = "off", @placeholder = "Unit Price", id = "unitPrice" } })
                            </td>
                            <td>
                                @Html.EditorFor(model => model.orderItems[i].quantity, new { htmlAttributes = new { @class = "form-control qty", @autocomplete = "off", @placeholder = "Qty", id = "qty" } })
                            </td>
                            <td>
                                @Html.EditorFor(model => model.orderItems[i].discount, new { htmlAttributes = new { @class = "form-control disc", @autocomplete = "off", @placeholder = "Disc", id = "discount" } })
                            </td>
                            <td valign="top">
                                <input type="button" class="btn-size btn btn-danger btn-sm btnDelRow" value="Del" id="btnDelRow" />
                            </td>
                        </tr>

                    }
                }
            </tbody>
        </table>
        <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
            <button type="submit" id="submit" class="btn btn-primary">Save Changes</button>
        </div>
    }


}

Model:

using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace SomeProject.Models
{
    public class OrderViewModel
    {
        public OrderViewModel()
        {
            // Initialize orderItems with an empty list in the constructor
            orderItems = new List<OrderItemViewModel>();
            orderItems.Add(new OrderItemViewModel()); 
        }
        public int masterQuotId { get; set; }

        // Master Quotation Fields
        [Required(ErrorMessage = "Quotation Number is required.")]
        public string quotationNumber { get; set; }

        public int customerId { get; set; }

        [Required(ErrorMessage = "Customer Name is required.")]
        public string customerName { get; set; }

        [Required(ErrorMessage = "IncoTerm is required.")]
        public string incoTerm { get; set; }

        [Required(ErrorMessage = "Payment Method is required.")]
        public string paymentTerm { get; set; }

        [Required(ErrorMessage = "Date is required.")]
        [DataType(DataType.Date)]
        public DateTime date { get; set; }

        // Master Quotation Details Fields
        public List<OrderItemViewModel> orderItems { get; set; }
        public List<QuotItems> orderItemsJson { get; set; }
        public int? selectedSupplierId { get; set; }
        public List<SelectListItem> SupplierNameList { get; set; }
    }

    public class OrderItemViewModel
    {
        public int masterQuotId { get; set; } 

        public int supplierId { get; set; }
        public string supplierName { get; set; }
        public int productCatId { get; set; }
        public string productCat { get; set; }

        public int productCatModelId { get; set; }
        public string productCatModel { get; set; }

        public decimal unitPrice { get; set; }

        public int quantity { get; set; }

        public decimal discount { get; set; }
    }
}

Controller:

[HttpGet]
public ActionResult AddorEdit(int Id = 0)
{
    OrderViewModel orderViewModel = new OrderViewModel();
    if (orderViewModel.orderItems == null)
    {
        orderViewModel.orderItems = new List<OrderItemViewModel>();
    }
    if (Id == 0)
    {
        ViewBag.CustomerNameList = dropdownMethods.Get_CustomersNameList();
        ViewBag.PaymentTermList = dropdownMethods.Get_PaymentTermList();
        ViewBag.IncoTermList = dropdownMethods.Get_IncoTermsList();
        ViewBag.SupplierNameList = dropdownMethods.Get_SuppliersNameList();

        OrderViewModel newOrderViewModel = new OrderViewModel
        {
            orderItems = new List<OrderItemViewModel>()
        };
        return PartialView("_AddorEdit", orderViewModel);
    }
    else
    {
        // Fetch Master Quotation Details
        OrderViewModel fetchedMasterData = dbLayer.GetQuotationMasterDetailsById(Id);

        // Fetch Quotation Items
        List<OrderItemViewModel> fetchedItemsData = dbLayer.GetQuotationItemsDetailsById(Id);

        if (fetchedMasterData != null && fetchedItemsData != null)
        {
            orderViewModel = fetchedMasterData;
            orderViewModel.orderItems = fetchedItemsData;

            List<SelectListItem> SupplierNameList = PopulateDropdown(fetchedItemsData, x => x.supplierId.ToString(), x => x.supplierName, orderViewModel.selectedSupplierId.GetValueOrDefault());
            ViewBag.SupplierNameList = SupplierNameList;

            return PartialView("_AddorEdit", orderViewModel);
        }
        else
        {
            return HttpNotFound();
        }
    }

}

// Common method to populate dropdown
public List<SelectListItem> PopulateDropdown<T>(IEnumerable<T> items, Func<T, string> valueFunc, Func<T, string> textFunc, int selectedValue)
{
    var selectList = new List<SelectListItem>();

    foreach (var item in items)
    {
        var value = (valueFunc(item) != null) ? valueFunc(item) : "DefaultValue";
        var text = (textFunc(item) != null) ? textFunc(item) : "DefaultText";

        var listItem = new SelectListItem
        {
            Value = value,
            Text = text,
            Selected = (value == selectedValue.ToString())
        };

        selectList.Add(listItem);
    }

    return selectList;
}

Error:

Here I need your help.

I have searched a lot and have also seen similar posts, but my problem has not been solved. That's why I have shared the problem here.

Answer 1

Your ViewBag.SupplierNameList is a List<SelectListItem> type.

In the SelectListItem class, there are no properties with names supplierId and supplierName.

To solve the issue, you should provide the property name that exists in the SelectListItem class.

new SelectList(ViewBag.SupplierNameList, "Value", "Text")

Instead, you can directly use the ViewBag.SupplierNameList without converting to SelectList.

@Html.DropDownListFor(model => model.orderItems[i].supplierName, 
    (List<SelectListItem>)ViewBag.SupplierNameList, 
    "-- Select Supplier --", 
    htmlAttributes: new { @class = "form-control supplier", id = "supplierDropdown" })

Reference: DropDownListFor<TModel,TProperty>(HtmlHelper<TModel>, Expression<Func<TModel,TProperty>>, IEnumerable<SelectListItem>, String, Object)