將參數傳遞給Telerik的ASP.NET MVC網格

我有一個Telerik的asp.net MVC網格，其需要基於用戶在單獨的文本框中輸入的搜索條件來進行填充。網格使用ajax方法來初始化以及進行分頁。將參數傳遞給Telerik的ASP.NET MVC網格

如何將搜索參數傳遞給網格，以便它每次發送這些參數時都會調用ajax方法來響應用戶單擊另一個頁面以轉到該頁面上的數據？

我讀了telerik的用戶指南，但沒有提到這種情況。我上面做的唯一方法是通過使用jquery將參數傳遞給客戶端的rebind（）方法。問題是，我不確定這是否是傳遞參數的「官方」方式，即使在更新後也會始終有效。我在telerik的網站上在這篇文章中發現了這種方法：link text

我必須傳入多個參數。當telerik網格調用時，控制器中的action方法根據搜索參數再次運行查詢。

這裏是我的代碼片段：

$("#searchButton").click(function() { 
    var grid = $("#Invoices").data('tGrid'); 

    var startSearchDate = $("#StartDatePicker-input").val(); 
    var endSearchDate = $("#EndDatePicker-input").val(); 

    grid.rebind({ startSearchDate: startSearchDate , 
        endSearchDate: endSearchDate 
       }); 
});

來源

2010-04-06 GlobalCompe

這實際上是記錄here。

來源

2010-04-07 07:54:38

所以，如果我理解正確的工作，所有我需要做的是設置綁定如下 Html.Telerik（）。網格（模型） .DataBinding（數據綁定=> databinding.Ajax（）。Select（「GetInvoicesInPages」，「Invoices」，new {startSearchDate =（string）ViewData [「StartDatePicker-input」]}）） .EnableCustomBinding（true）並在客戶端執行 $（「＃searchButton」）。click（function（）{var grid = $（「＃Invoices」）。data（'tGrid'）; grid.ajaxRequest（）;} ）; – GlobalCompe 2010-04-07 18:36:32

給這一個嘗試：Telerik MVC Grid External Filter

這是一個jQuery插件，它允許您設置的自定義輸入控件過濾器。

來源

2010-05-09 14:50:01

此解決方案不會在服務器端進行過濾，是嗎？從我可以收集的內容中，您正在篩選已針對數據源執行的選擇。 – Merritt 2011-03-08 20:41:17

對於我自己我使用ViewModel對象，我通過使用jQuery和JavaScript對象，我的視圖是強類型SearchMemberModel，女巫包含我的搜索字段，我有我的視圖中的每個字段的文本框。我的數據綁定是將模型傳遞給控制器。然後我用javascript構建我的對象，並在rebind調用中將其傳遞給我的控制器。

這裏是我的代碼：

觀的javascrip

<%@ Page Language="C#" MasterPageFile="~/Views/Shared/Admin.Master" Inherits="System.Web.Mvc.ViewPage<Enquete.Models.SearchMemberModel>" %> 

<% using (Html.BeginForm()) {%> 
    <%: Html.ValidationSummary(true) %> 

    <fieldset> 
     <legend><%: Resources.Search %></legend> 

     <div class="editor-label"> 
      <%: Html.LabelFor(model => model.MemberNumber) %> 
     </div> 
     <div class="editor-field"> 
      <%: Html.TextBoxFor(model => model.MemberNumber) %> 
      <%: Html.ValidationMessageFor(model => model.MemberNumber) %> 
     </div> 

     <div class="editor-label"> 
      <%: Html.LabelFor(model => model.Email) %> 
     </div> 
     <div class="editor-field"> 
      <%: Html.TextBoxFor(model => model.Email) %> 
      <%: Html.ValidationMessageFor(model => model.Email) %> 
     </div> 

     <div class="editor-label"> 
      <%: Html.LabelFor(model => model.FirstName) %> 
     </div> 
     <div class="editor-field"> 
      <%: Html.TextBoxFor(model => model.FirstName) %> 
      <%: Html.ValidationMessageFor(model => model.FirstName) %> 
     </div> 

     <div class="editor-label"> 
      <%: Html.LabelFor(model => model.LastName) %> 
     </div> 
     <div class="editor-field"> 
      <%: Html.TextBoxFor(model => model.LastName) %> 
      <%: Html.ValidationMessageFor(model => model.LastName) %> 
     </div> 

     <div class="editor-label"> 
      <%: Html.LabelFor(model => model.Phone) %> 
     </div> 
     <div class="editor-field"> 
      <%: Html.TextBoxFor(model => model.Phone) %> 
      <%: Html.ValidationMessageFor(model => model.Phone) %> 
     </div> 

     <div class="editor-label"> 
      <%: Html.LabelFor(model => model.Active) %> 
     </div> 
     <div class="editor-field"> 
      <%: Html.CheckBoxFor(model => model.Active) %> 
      <%: Html.ValidationMessageFor(model => model.Active) %> 
     </div> 

     <p> 
      <input type="submit" value="<%: Resources.ToSearch %>" id="btnSearch" /> 
     </p> 
    </fieldset> 

<% } %> 

<%= Html.Telerik().Grid<SerializableMember>() 
       .Name("Grid") 
       .Columns(colums => 
       { 
        colums.Bound(c => c.Email).Title(Resources.Email);//.ClientTemplate("<a href=\"" + Url.Action(MVC.Admin.Edit()) + "/<#=Id#>\" ><#=Email#></a>"); 
        colums.Bound(c => c.FirstName).Title(Resources.FirstName); 
        colums.Bound(c => c.LastName).Title(Resources.LastName); 
        colums.Bound(c => c.MemberNumber).Title(Resources.MemberNumber); 
        colums.Bound(c => c.Active).Title(Resources.Active).HeaderHtmlAttributes(new { @class = "center-text" }).HtmlAttributes(new { @class = "center-text" }).ClientTemplate("<img src=\"Content/images/icons/<#=Active#>.png\" alt=\"<#=Active#>\" />"); 
        colums.Bound(c => c.Id).Title(" ").HtmlAttributes(new { @class = "center-text" }).ClientTemplate("<a href=\"" + Url.Action(MVC.Member.ResetPassword()) + "/<#=Id#>\" title=\"" + Resources.ResetPassword + "\" >" + Resources.ResetPassword + "</a>"); 
        colums.Bound(c => c.Id).Title(" ").HtmlAttributes(new { @class = "center-text" }).ClientTemplate("<a href=\"" + Url.Action(MVC.Member.Activate()) + "/<#=Id#>\" title=\"" + Resources.Activate + "\" >" + Resources.Activate + "</a>"); 
        colums.Bound(c => c.Id).Title(" ").HtmlAttributes(new { @class = "center-text" }).ClientTemplate("<a href=\"" + Url.Action(MVC.Member.Deactivate()) + "/<#=Id#>\" title=\"" + Resources.Deactivate + "\" >" + Resources.Deactivate + "</a>"); 
       }) 
       //.DataBinding(d => d.Ajax().Select("ListAjax", "Member", Model)) 
       .DataBinding(d => d.Ajax().Select(MVC.Member.ListAjax(Model).GetRouteValueDictionary())) 
       .Sortable() 
       .NoRecordsTemplate(Resources.NoData) 
     %> 
     <%= Html.AntiForgeryToken() %> 

     <script type="text/javascript"> 
      $(document).ready(function() { 
       $('#btnSearch').click(function() { 
        var grid = $('#Grid').data('tGrid'); 
        var searchModel = { 
         MemberNumber: $('#MemberNumber').val(), 
         Email: $('#Email').val(), 
         FirstName: $('#FirstName').val(), 
         LastName: $('#LastName').val(), 
         Phone: $('#Phone').val(), 
         Active: $('#Active').is(':checked') 
        }; 
        grid.rebind(searchModel); 
        return false; 
       }); 
      }); 
     </script> 

     <%= Html.Telerik().ScriptRegistrar().jQuery(false).DefaultGroup(g => g.DefaultPath("~/Content/Javascript/2010.3.1110"))%>

這就是我的控制器

[GridAction] 
    public virtual ActionResult ListAjax(SearchMemberModel search) 
    { 
     var gridModel = new GridModel<SerializableMember>(); 
     var data = _session.All<Member>(); 
     if (search != null) 
     { 
      if (search.Active) data = data.Where(x => x.Active); 
      if (!string.IsNullOrEmpty(search.Email)) data = data.Where(x => x.Email.Contains(search.Email)); 
      if (!string.IsNullOrEmpty(search.FirstName)) data = data.Where(x => x.FirstName.Contains(search.FirstName)); 
      if (!string.IsNullOrEmpty(search.LastName)) data = data.Where(x => x.LastName.Contains(search.LastName)); 
      if (!string.IsNullOrEmpty(search.MemberNumber)) data = data.Where(x => x.MemberNumber.Contains(search.MemberNumber)); 
      if (!string.IsNullOrEmpty(search.Phone)) data = data.Where(x => x.Phone.Contains(search.Phone)); 
     } 

     var list = new List<SerializableMember>(data.Count()); 
     list.AddRange(data.ToList().Select(obj => new SerializableMember(obj))); 
     gridModel.Data = list; 
     return View(gridModel); 
    }

我可以給你我的搜索模型類太：

public class SearchMemberModel 
{ 
    [LocalizedDisplayName("MemberNumber")] 
    public string MemberNumber { get; set; } 

    [LocalizedDisplayName("Email")] 
    [DataType(DataType.EmailAddress)] 
    public string Email { get; set; } 

    [LocalizedDisplayName("FirstName")] 
    public string FirstName { get; set; } 

    [LocalizedDisplayName("LastName")] 
    public string LastName { get; set; } 

    [LocalizedDisplayName("Phone")] 
    public string Phone { get; set; } 

    [LocalizedDisplayName("ActiveOnly")] 
    public bool Active { get; set; } 
}

希望它可以幫助任何人在那裏！

來源

2010-12-01 16:58:45 VinnyG

您的方法與GlobalCompe基本相同 - 將Javascript參數傳遞給rebind調用。我用這種方法看到的問題是，在分頁時參數丟失。你也看到了嗎？ – 2011-03-07 19:52:32

已解決，有點。這個（分頁）在MVC擴展的最新（Q1-2011）測試版中被打破。 – 2011-03-07 22:21:28

很高興幫助你！ – VinnyG 2011-03-08 17:31:22

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#apply').click(function() { 
      var params = { 
       showDisabled : $('input[name=ShowDisabled]').attr('checked'), 
       showExpired : $('input[name=ShowDisabled]').attr('checked') 
      }; 

      var grid = $('#Grid').data('tGrid'); 
      grid.rebind(params); 
     }); 
    }); 
</script>

這裏是綁定到您的選擇命令控制器動作：

[GridAction(EnableCustomBinding=true)] 
public ActionResult _BindGrid(GridCommand command, string mode, int? id, bool showExpired, bool showDisabled) 
{ 
    return View(new GridModel(GetMessageGridItems(command, mode, id, showExpired, showDisabled))); 
}

帕拉姆「命令」有排序和尋呼信息。注意：這個解決方案適用於ajax-ified網格。如果你正在做直接的帖子，你仍然可以使用GridCommand命令參數來維持分頁/過濾/排序的狀態。

來源

2011-03-09 15:57:18 Merritt

所以根據Telerik的「推薦的方法是設置參數在onDataBinding事件」。

function onGridBinding(e) { 
if (cancelGridBinding) { 
    // ... 
} 
else { 
    var searchValue = 'something'; 
    e.data = { search: searchValue }; 
}

}

來源

2011-03-09 18:13:36

這裏是telerix AJAX回發期間傳遞參數從形式回到一個更簡單的方法。

只需掛鉤全局$ .ajaxPrefilter事件並使用jquery將您的內容序列化爲正在提交的URL。這將ASP.MVC模型綁定

<script type="text/javascript"> 

$.ajaxPrefilter(function (options) { 
    options.url = options.url + "&" + $("form").serialize(); 
}); 

</script>

來源

2012-03-23 22:49:12

將參數傳遞給Telerik的ASP.NET MVC網格

回答

相關問題