MVC 3剃鬚刀 - 保持頁面請求之間的複選框值

Question

我有一個頁面，用於過濾webgrid複選框。

要通過取消選中複選框來提出我的問題，將通過使用ajax請求篩選數據，以在我的webgrid中顯示更少的結果。但是一旦我點擊webgrid下面的數字來循環訪問網格中的下一組記錄，我就會丟失我的複選框的當前狀態。這是因爲我再次調用我的ActionResult方法，它再次加載頁面。

那麼如何在頁面加載之間維護這些複選框值呢？

這是我的看法

@model IEnumerable<UserManager.Models.vw_UserManager_Model> 


@*@model UserManager.Models.vw_UserManager_Model 
*@ 
@{ 
    ViewBag.Title = "User Manager Dashboard"; 
} 

    @Html.ActionLink("Create New User", "CreateUser") 


<div class="webgrid-filter"> 
    <b>@Html.Label("Select a filter: ")</b> 
    <br /> 
    @Html.Label("Toggle ALF Intelligence users:") 
    <input name="User logged in" type="checkbox" onclick="filterGrid('@Url.Action("Index", "UserManager")')" id="chkFilterAlfIntell" checked="checked" /> 
    @Html.Label("Toggle ALF Connect users:") 
    <input name="User logged in" type="checkbox" onclick="filterGrid('@Url.Action("Index", "UserManager")')" id="chkFilterAlfConn" checked="checked"/> 
    @Html.Label("Toggle BRAD users:") 
    <input name="User logged in" type="checkbox" onclick="filterGrid('@Url.Action("Index", "UserManager")')" id="chkFilterBrad" checked="checked"/> 
</div> 

<div id="webgrid-wrapper"> 
    @Html.Partial("~/Views/Partial/_WebGridUserManager.cshtml", Model) 
    </div> 
<br /> 


<script type="text/javascript"> 
    $(document).ready(function() { 

     // Disable checkboxs where a user is not active. 
     $(".webgrid-wrapper input:not(:checked)").attr("disabled", "disabled"); 

     // Style tables. 
     function jQueryUIStyling() { 
      $('input:button, input:submit').button(); 

      $('.webgrid-wrapper').addClass('ui-grid ui-widget ui-widget-content ui-corner-all'); 
      $('.webgrid-title').addClass('ui-grid-header ui-widget-header ui-corner-top'); 
      jQueryTableStyling(); 
     } // end of jQueryUIStyling 

     function jQueryTableStyling() { 
      $('.webgrid').addClass('ui-grid-content ui-widget-content'); 
      $('.webgrid-header').addClass('ui-state-default'); 
      $('.webgrid-footer').addClass('ui-grid-footer ui-widget-header ui-corner-bottom ui-helper-clearfix'); 
     } // end of jQueryTableStyling 
    }); 
</script> 
<script type="text/javascript"> 

    function filterGrid(url) { 
     var filters = getFilterVals(); 
//  console.log(filters); 

     $.ajax({ 
      url: url, 
      type: "POST", 
      async: true, 
      dataType: "html", 
      data: "alfConnect=" + filters.alfConnect + "&" + "alfIntelligence=" + filters.alfIntelligence + "&" + "brad=" + filters.brad, 
      success: function (data) { 
       $('#webgrid-wrapper').empty().html(data); 
//    $('#webgrid-wrapper').html(data); 
      } 
     }); 
    } 

    function getFilterVals() { 
     filters = new Object(); 
     if ($('.webgrid-filter #chkFilterAlfIntell').is(':checked')) { 
      filters.alfIntelligence = 1; 
     } 
     else { 
      filters.alfIntelligence = 0; 
     } 

     if ($('.webgrid-filter #chkFilterAlfConn').is(':checked')) { 
      filters.alfConnect = 1; 
     } 
     else { 
      filters.alfConnect = 0; 
     } 

     if ($('.webgrid-filter #chkFilterBrad').is(':checked')) { 
      filters.brad = 1; 
     } 
     else { 
      filters.brad = 0; 
     } 
     return filters; 

    } 

    function logUserOff(url) { 
     var answer = confirm('Are you sure you want to save this data?') 
     if (answer) { 
//   alert(url + ": " + value); 

      $.ajax({ 
       url: url, 
       type: "POST" 
//    data: value 
      }).done(function() { 
       $(this).addClass("done"); 
      }); 


      return true; 
     } 
     else { 
      return false; 
     } 
    }; 
</script> 

在DIV類的WebGrid過濾器，你可以看到，我想保持的值的複選框。

我的ActionResult對這一觀點

public ActionResult Index() 
     { 
      try 
      { 
       var model = new UserManagerTestEntities().vw_UserManager_Model; 
       //var model = new UserManager.Models.vw_UserManager_Model(); 
       return View(model.ToList()); 

      } 
      catch (Exception ex) 
      { 
       return View(ViewBag); 
      } 

     } 

有沒有人有什麼建議？謝謝！

Answer 1

而不是在你的控制器上執行操作，也許你可以：作爲複選框的點擊操作調用JavaScript函數，最終會使ajax調用。