Флажок остается установленным после отправки

#c# #html #asp.net-core #.net-core

#c# #HTML #asp.net-ядро #.net-ядро

Вопрос:

Итак, у меня есть эти флажки, которые передают значения контроллеру, и эти значения затем используются для получения чего-либо обратно из базы данных. Но когда я нажимаю кнопку отправки, все работает, но отмеченные флажки теперь сняты. Это представление:

 <form>
@foreach(var type in types) {
<input type="checkbox" name="checkedTypes" value="@type.id" />
<label>@type.Name</label>
}
<button type="submit" class="btn customGreen">Set filters</button>
</form>
  

И это контроллер:

 public async Task < ViewResult > Index(List < int > checkedTypes) 
{
var products = from p in _db.Products
select p;

if (checkedTypes.Count != 0) {
products = products.Where(p =>checkedTypes.Contains(p.TypeId));
}

return View(product);
}
  

Есть ли способ сохранить отмеченные флажки после отправки? Или есть лучший способ обработки флажков с помощью .net core.

Ответ №1:

Вы можете сохранить checkedTypes в ViewBag, затем определить, затем определить, нужно ли устанавливать флажок на интерфейсе.

Простой пример, как показано ниже:

Вид:

 @{ 
    var types = new List<MyType>
    {
        new MyType{Id = 1, Name ="AA"},
        new MyType{Id = 2, Name ="BB"},
        new MyType{Id = 3, Name ="CC"},
    };
    var checkedTypes = ViewBag.checkedTypes;
}

<form method="post">
    @foreach (var type in types)
    {
        if (checkedTypes != null amp;amp; checkedTypes.Contains(type.Id))
        {
            <input type="checkbox" name="checkedTypes" value="@type.Id" checked />
        }
        else
        {
            <input type="checkbox" name="checkedTypes" value="@type.Id" />
        }

        <label>@type.Name</label>
    }
    <button type="submit" class="btn customGreen">Set filters</button>
</form>
  

Контроллер:

 public IActionResult Index()
{
    return View();
}

[HttpPost]
public async Task<ViewResult> Index(List<int> checkedTypes)
{
    if (checkedTypes.Count != 0)
    {
        ViewBag.checkedTypes = checkedTypes;
    }
    return View();
}
  

Результат:

введите описание изображения здесь

Комментарии:

1. Спасибо @mj1313 за то, что потратили время на все это, и это работает. Я немного изменил его, но идея практически та же. Еще раз спасибо!

2. нужно ли вводить ввод 2 раза? можно ли сделать что-то подобное php, django, react и т.д., например: <input @checkedtypes.Contain(id) ? "checked" : null /> ?