ASP.NET MVC CheckBox

Question

У меня есть вид MVC, который отображает список записей.

Я хочу установить флажок, который позволяет скрывать / отображать неактивные записи.

Как я могу сделать так, чтобы, когда пользователь ставит / снимает флажок, он попадает в контроллер и возвращает полный список или список подмножеств? Должен ли я использовать вызов AJAX?

Должно ли все это быть сделано с помощью метода Index? (обычно это просто возвращает список всех записей).

Любая помощь / идеи приветствуются.

Answer 1

Предположим, у вас есть такой контроллер:

public class YourController : Controller {
    public ActionResult ShowOrHide(RecordInfo[] info) {
        RecordInfo[] existing = GetExisting();          
        if (IsPost()) {
            for (int i = 0; i < existing.Length; i++) {
                // Merge so it will go to the View Model in case of validaiton errror
                // Should also check the array bounds
                r.IsVisible = info[i].IsVisible;
                ShowOrHideRecord(r);
            }
            return RedirectToAnotherAction();
        }
        return View(existing);
    }
}

И выглядит так:

<% for(int i=0; i <= Model.Length; i++) { %>
    <div class="item">
        <% var name = "info[" + i + "].IsVisible"; %>
        <% Html.CheckBox(name) %>
        <label for="<%=name.Replace('.', '_')%>"><%= Model[i].Caption %></label>
    </div>
<% } %>

Все должно работать. Просто обратите внимание на возможные значения NULL.

Это будет работать без AJAX вообще, или вы можете легко обернуть его AjaxForm обычным способом. Так что изящная деградация тоже будет работать.

Answer 2

Я некоторое время работал над приложением CRM на основе ASP.NET MVC. Я столкнулся с той же проблемой при получении списка потенциальных клиентов. Что пользователи (т. Е. Менеджеры по продажам, торговые представители и т. Д.) Обычно предпочитают видеть в списке потенциальных клиентов, являются «горячими» или «активными». В моем случае я загружаю все «горячие» / «активные» выводы в методе Index. У меня есть частичное представление (в представлении «Индекс»), в котором есть список флажков, эти флажки представляют различные этапы отведения, например, «связался», «преобразован», «закрыт». Когда пользователь нажимает на один из флажков, я делаю AJAX / jQuery GET всех отведений, которые имеют статус в массиве проверенных чекбоксов. Пример -

   $(document).ready(function() {

      $(".lead-status").click(
         function() {
            var checkedOptions = '';
            $("input[class=lead-status]:checked").each(
               function() {
                  checkedOptions += $(this).attr('name') + ',';
               });

            var leadFilterUrl = "/Lead/FilteredLeadList/?filterString=" + checkedOptions;
            $.get(leadFilterUrl, function(data) {
               var divToShowId = "#leads";
               var divToShow = $(divToShowId);
               divToShow.html('');
               divToShow.html(data);
            },
            "html");

         });
   });    

Частичное представление флажков выглядит так -

 <div class="filters-body">
  <div class="checkbox-holder">
     <div id="new-leads-count" style="float:right;"><%= Model.NewLeadsCount.ToString() %></div>
     <%= Html.CheckBox("new", new { @checked = "checked", @class = "lead-status" }) %>
     New
  </div>
  <div class="checkbox-holder">
     <div id="contacted-leads-count" style="float:right;"><%= Model.ContactedLeadsCount.ToString() %></div>
     <%= Html.CheckBox("contacted", new { @checked = "checked", @class = "lead-status" })%>
     Contacted
  </div>   
  <div class="checkbox-holder">
     <div id="following-up-leads-count" style="float:right;"><%= Model.FollowingUpLeadsCount.ToString() %></div>
     <%= Html.CheckBox("following", new { @checked = "checked", @class = "lead-status" })%>
     Following up
  </div>
  <div class="checkbox-holder">
     <div id="rejected-leads-count" style="float:right;"><%= Model.RejectedLeadsCount.ToString() %></div>
     <%= Html.CheckBox("rejected", new { @checked = "checked", @class = "lead-status" })%>
     Rejected
  </div>   
  <div class="checkbox-holder">
     <div id="converted-leads-count" style="float:right;"><%= Model.ConvertedLeadsCount.ToString() %></div>
     <%= Html.CheckBox("converted", new { @checked = "checked", @class = "lead-status" })%>
     Converted
  </div>   
  <div class="summary">
     <div id="total-leads-count" style="float:right;"><b><%= Model.TotalLeadsCount.ToString() %></b></div>
     <b>Total Leads</b>
  </div>   

В контроллере FilteredLeadList я выбираю список потенциальных клиентов из базы данных на основе выбранных фильтров и возвращаю HTML, который затем устанавливается в соответствующем div.

Я надеюсь, что это дает представление о том, как использовать AJAX / jQuery для получения частичного списка элементов. Я работаю над улучшением приложения для использования JSON вместо HTML, что должно повысить производительность.

Надеюсь, это поможет, Инди