skip to Main Content

I’m doing a small project using Razor pages. It’s about cars. So I’ve created two scaffolded items from two classes: Maker and Model.

This is the Maker class

public class Maker
{
    public int Id { get; set; }
    public string Name { get; set; }
}

And this is the Model class

public class Model
{
    public int Id { get; set; }
    public Maker Maker { get; set; }
    public string Name { get; set; }
}

public class CreateModel : PageModel
{
    private readonly ArchivioItalianeDaCorsa.Data.ApplicationDbContext _context;
    public List<SelectListItem> makers { get; set; }

    public CreateModel(ArchivioItalianeDaCorsa.Data.ApplicationDbContext context)
    {
        _context = context;
    }

    public IActionResult OnGet()
    {
        caseAutomobilistiche = _context.makers.Select(maker => new 
        SelectListItem
        {
            Text = maker.Name,
            Value = maker.Id.ToString()
        }).ToList();
        return Page();
    }

    [BindProperty]
    public Modello Modello { get; set; }

    // To protect from overposting attacks, see https://aka.ms/RazorPagesCRUD
    public async Task<IActionResult> OnPostAsync()
    {
        if (!ModelState.IsValid)
        {
            return Page();
        }

        _context.Model.Add(Modello);

        await _context.SaveChangesAsync();

        return RedirectToPage("./Index");
    }
}

And last but not the least, the html

<h1>Create</h1>

<h4>Modello</h4>
<hr />
<div class="row">
    <div class="col-md-4">
        <form method="post">
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
            <div class="form-group">
                <label asp-for="Model.Maker" class="control-label"></label>
                <select class="form-select" aria-label="Marca select" asp-items="Model.makers" asp-for="Model.Maker" name="Marca">
                   <option>Seleziona una marca</option>
                </select>
                <label asp-for="Model.Name" class="control-label"></label>
                <input asp-for="Model.Name" class="form-control" />
                <span asp-validation-for="Model.Name" class="text-danger"></span>
            </div>
            <div class="form-group">
                <input type="submit" value="Create" class="btn btn-primary" />
            </div>
        </form>
    </div>
</div>

My problem appears when I try to create a new Model. In onGet I query the database to show all the possible makers in a select tag, but I can’t bind the choice to the object that needs to be saved.

Is the class Model wrong?

PS: the code was initially written in Italian, I’ve translated it while asking the question so if something is not clear let me know and I will fix the question

2

Answers


  1. In your select list item, the value in the option field is the Maker.Id, hence the value being passed to your model is an integer, not the object.

    It’s better to be explicit when writing your constraints, rewrite your Model class like this;

    public class Model
    {
        [DatabaseGenerated(DatabaseGeneratedOption.Identity)]
        public int Id { get; set; }
        public string Name { get; set; }
    
        public int MakerId { get; set; }
        [ForeignKey("MakerId")]
        public Maker Maker { get; set; }
    
    }
    

    In the code above, we are explicitly instructing entity framework that Model has a non nullable foreign key MakerId. This property will be a column in the database wherein you’ll be able to save the value from your select list.

    Try to scaffold a new razor page after rewriting your models.

    Login or Signup to reply.
  2. asp-items="Model.makers" asp-for="Model.Maker" name="Marca"

    1.According to asp-items="Model.makers" in your html , you use makers to bind data. In your OnGet, change caseAutomobilistiche into makers

    2.Delete name attribute , because asp-for will generate name to bind the data .

    3.change asp-for="Model.Maker"into asp-for="Model.Maker.Id"

    You can get MakerId,then do your other things.

    Result:

    enter image description here

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search