Передача параметров в telerik asp.net mvc grid

Question

У меня есть сетка telcik asp.net mvc, которая должна быть заполнена на основе критериев поиска, которые пользователь вводит в отдельные текстовые поля. Сетка использует метод ajax для загрузки себя изначально, а также для подкачки.

Как передать параметры поиска в сетку так, чтобы они посылали эти параметры «каждый раз», когда он вызывает метод ajax в ответ на то, что пользователь нажимает на другую страницу, чтобы перейти к данным на этой странице?

Я прочитал инструкцию пользователя telerik, но не упоминает этот сценарий. Единственный способ, который я смог сделать выше, - передать параметры методу rebind() на стороне клиента, используя jquery. Проблема в том, что я не уверен, является ли это «официальным» способом передачи параметров, которые всегда будут работать даже после обновлений. Я нашел этот метод в этой должности на сайте telerik: link text

Мне нужно сдать несколько параметров. Метод действия в контроллере при вызове сетки telerik снова запускает запрос на основе параметров поиска.

Вот отрывок из моего кода:

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

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

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

Answer 1

На самом деле это документально here.

Answer 2

дать этому попытку: Telerik MVC Grid External Filter

Это JQuery плагин, который позволяет установить фильтр по пользовательские элементы управления вводом.

Answer 3

Для себя я использую объект ViewModel, который передаю с помощью jQuery и javascript-объекта, мой вид сильно набрал SearchMemberModel, ведьма содержит мои поля поиска, и у меня есть текстовое поле для каждого поля в моем представлении. Моя привязка данных заключается в передаче модели контроллеру. Затем я создаю свой объект в javascript и передаю его моему контроллеру во время повторного вызова.

Вот мой код:

Просмотр и 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; } 
} 

Надеюсь, это поможет любому, кто там!

Answer 4

<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))); 
} 

«Команда» PARAM имеет информацию сортировки и пейджинга. Примечание. Это решение предназначено для ajax-ified grid. Если вы выполняете прямые сообщения, вы можете использовать параметр команды GridCommand для поддержания состояния пейджинга/фильтрации/сортировки.

Answer 5

Поэтому, согласно Telerik, «рекомендуется применять аргументы в событии onDataBinding».

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

}

Answer 6

Вот более простой способ для передачи параметров от вашей формы во время telerix АЯКС пост обратно.

Просто подключитесь к глобальному событию $ .ajaxPrefilter и используйте jquery для сериализации содержимого вашего сайта с URL-адресом, который отправляется. Это будет работать с ASP.MVC модель связывания

<script type="text/javascript"> 

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

</script>