How can I add items to a list in my View Model within a View in ASP.Net MVC?

Question

I'm hoping someone can point me in the right direction here. I am trying to add to a list of items in my form. I have searched for a couple days, and tried a lot of variations of things that I have lost track of all the things I havde done. I'm at my wits end.

Some things I have tried: I found a couple answers on here referencing a post from 5 years ago which I tried but couldnt get to work. I tried using ajax I tried using ajax with a partial view

I'm hoping someone can help me with it.

I have a ViewModel like this:

public class CustomerFormViewModel
{
    public Customer Customer { get; set; }

    [Remote("DoesCustomerExist", "Customers", HttpMethod = "POST", ErrorMessage = "There is already a customer by that name. Please enter another name.")]
    public string CustomerName
    {
        get { return Customer.Name; }
        set { Customer.Name = value; }
    }

    public IEnumerable<Key> Keys { get; set; }

    public List<int> KeyIds = new List<int>();
 }

And the Customer model looks like this:

public class Customer
{
    public int Id { get; set; }

    [Required]
    [StringLength(255)]
    public string Name { get; set; }

    public string Address { get; set; }

    public string Country { get; set; }

    public DateTime DateAdded { get; set; }
}

Essentially, in my view, I want to display a form where the admin enters the customers details, and clicks an "add key" button to add items to the list of "KeyIds".

My view is something like this:

@model LowKey.ViewModels.CustomerFormViewModel
@{
    ViewBag.Title = "CustomerForm";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>@Model.Title</h2>

@using (Html.BeginForm("Save", "Customers"))
{
    <div id="customers">
        <div class="form-group">
                @Html.LabelFor(o => o.Customer.Name)
                @Html.TextBoxFor(o => o.Customer.Name, new {@class = "form-control"})
                @Html.ValidationMessageFor(o => o.Customer.Name, "", new {@class = "text-danger"})
        </div>
   </div>
}

Perhaps my domain models are not set up properly, or my viewmodel could be different, but I've tried using a partial view for the KeyList, but I can't seem to get that to work. Any ideas?

Answer 1

the best solution for your work is :

1. Cookie

   using Cookies ! because you have access cookie form ASP(server side) and javascript(client side). so just add your data to cookie ! just need to learn how to use cookie in c# and javascript, this link for c# and this for javascript .

2. Using Ajax you can use jquery ajax to send info of your customer to the server side (via jquery and ajax) then you save those info in database(via asp.net c#). this link is for learning how to send info with jquery ajax