How to fill data i get it on pge model on drop down list on view ?

ahmed salah 20 Reputation points
2023-05-04T00:17:02.8+00:00

I worked on asp.net mvc razor pages . I face issue I can't pass data from page model to view

what i try

1- I create view model as

public class AddUserViewModel
    {
       
        public int SelectedBranchId { get; set; }
        public List<Branch> Branches { get; set; }
    }

2-Branch Model

public class Branch
    {
        [Key]
        public string iBranchCode { get; set; }
        public string vBranchDesc { get; set; }
    }

3 - on razor pages AddUser.cshtml.cs I get 81 rows on userModel.Branches

public class AddUserModel : PageModel
    {
        [BindProperty]
        public AddUserViewModel userModel { get; set; }
        private readonly ADCContext _db;
        public AddUserModel(ADCContext db)
        {
            _db = db;
            userModel = new AddUserViewModel();
        }
        public void OnGet()
        {
            userModel.Branches= _db.Branch.ToList();// from debug get 81 rows
           //userModel.Branches have 81 rows
        }
       }

4 - on view AddUser.cshtml (main issue )

How to access userModel.Branches Branch List from page model to view

meaning How to fill (81 rows) on drop down list on view from data I received on page model

@page "/AddUser"
@model UC.ADC.Host.Pages.Users.AddUserModel

 <div class="form-group row">
            <label for="branch-select" class="col-sm-1 col-form-label" style="font-size:15px;font-family: 'Open Sans', sans-serif;font-weight: bold;">Branch</label>
            <div class="col-sm-3">
                <select id="branch-select" name="SelectedBranchId"  class="form-control" style=" margin-left:10px;font-size:15px;font-family: 'Open Sans' , sans-serif;font-weight: bold;">
                    <option value="">-- Select Branch --</option>
                    
                    @foreach (var branch in Model.????)
                    {
                        <option value="@branch.iBranchCode">@branch.vBranchDesc</option>
                    }
                </select>
            </div>
        </div>
ASP.NET Core
ASP.NET Core
A set of technologies in the .NET Framework for building web applications and XML web services.
4,292 questions
ASP.NET
ASP.NET
A set of technologies in the .NET Framework for building web applications and XML web services.
3,374 questions
0 comments No comments
{count} votes

Accepted answer
  1. Zhi Lv - MSFT 32,056 Reputation points Microsoft Vendor
    2023-05-04T01:39:39.5333333+00:00

    Hi @ahmed salah

    How to access userModel.Branches Branch List from page model to view

    Since in the AddUser.cshtml.cs file, the property name is userModel, to access the branches, you should also access the data from the userModel.

    Try to use the following code:

                    <select id="branch-select" name="SelectedBranchId"  class="form-control" style=" margin-left:10px;font-size:15px;font-family: 'Open Sans' , sans-serif;font-weight: bold;">
                        <option value="">-- Select Branch --</option>
                        
                        @foreach (var branch in Model.userModel.Branches)
                        {
                            <option value="@branch.iBranchCode">@branch.vBranchDesc</option>
                        }
                    </select>
    

    The output as below:

    User's image


    If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

    Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

    Best regards,

    Dillion

    0 comments No comments

1 additional answer

Sort by: Most helpful
  1. Bruce (SqlWork.com) 59,306 Reputation points
    2023-05-04T02:02:50.2966667+00:00

    with Razor pages, the page is view model. the the Model, AddUserViewModel is the property userModel. is its:

    <select id="branch-select" name="userModel.SelectedBranchId"  class="form-control" style=" margin-left:10px;font-size:15px;font-family: 'Open Sans' , sans-serif;font-weight: bold;">
       @foreach (var branch in userModel.Branches)
       {
          <option value="@branch.iBranchCode">@branch.vBranchDesc</option>
       }
    </select>
    

    there is really no reason for the extra class, I'd remove it and build a select item list

    public class AddUserModel : PageModel
    {
            [BindProperty]
            public int SelectedBranchId { get; set; }
     
            public List<SelectListItems> BranchList { get; set; }
            private readonly ADCContext _db;
    
            public AddUserModel(ADCContext db)
            {
                _db = db;
            }
    
            public async Task OnGetAsync()
            {
                BranchList = await _db.Branch.Select(b => new SelectListItem
                {
                    Value = b.iBranchCode.ToString(),
                    Text = b.vBranchDesc
                } ToList();
            }
    }
    
    <select id="branch-select" 
    	asp-for="SelectedBranchId" 
    	asp-items="Model.BranchList"
        class="form-control" 
        style="margin-left:10px;font-size:15px;font-family:'Open Sans',sans-serif;font-weight: bold;"
    />
    
    0 comments No comments