Question

我是初学者，使用nopCommerce 2.30（MVC 3 Razor）和Telerik（）。网格。我目前正在工作

在Nop.Admin项目上。我尝试在我的表单中创建一个Html.Telerik（）。网格，具有许多功能。

请参阅下面的网格图片。

enter image description here

这些是功能。

网格数据应该过滤下拉列表的选定值。
所有网格列都启用排序。
包含一个复选框，用于多选。
网格视图必须启用列上下文菜单。

请参阅下面的代码。

我的.cshtml文件

     <td>
        @(Html.Telerik().Grid<NotificationMailReminderModel>()
                    .Name("productvariants-grid")

                    .DataKeys(keys =>
                    {
                        keys.Add(pv => pv.Username);
                    })
                    .DataBinding(dataBinding =>
                        dataBinding.Ajax()
                                .Select("EmailReminderByEvent", "Customer")
                    )
                    .Columns(columns =>
                    {
                        columns.Bound(pv => pv.IsSelected)
                        .ClientTemplate("<input type='checkbox'  name='Id' value='<#= Id #>' />")
                        .HeaderTemplate(@<text><input type="checkbox" title="check all records" id="checkAllRecords" /></text>)
                        .Width(50)

                        .HeaderHtmlAttributes(new { style = "text-align:center" })
                        .HtmlAttributes(new { style = "text-align:center" });
                        columns.Bound(pv => pv.Username).ReadOnly().Width(250);
                        columns.Bound(pv => pv.Firstname).ReadOnly();
                        columns.Bound(pv => pv.Lastname).ReadOnly();
                    })
                            .ClientEvents(events => events.OnDataBinding("Grid_onDataBinding").OnError("Grid_onError").OnSubmitChanges("Grid_onSubmitChanges")
                            .OnRowDataBound("onRowDataBound"))
                    .Editable(editing => editing.Mode(GridEditMode.InCell))
                    .Pageable(settings => settings.PageSize(2).Position(GridPagerPosition.Both))
                    .Sortable(sorting => sorting.Enabled(true))
        )
        <script type="text/javascript">

            $(document).ready(function () {
                $('#search-products').click(function () {
                    var grid = $('#productvariants-grid').data('tGrid');
                    grid.currentPage = 1; //new search. Set page size to 1
                    grid.ajaxRequest();
                    return false;
                });
                $('#send-mail-reminder').click(function () {
                    var grid = $('#productvariants-grid').data('tGrid');
                    grid.ajaxRequest();
                    return false;
                });

                $('#grdCustomerEventRoleData #productvariants-grid table thead #checkAllRecords').click(function () {
                    $("#grdCustomerEventRoleData #productvariants-grid table tbody input:checkbox").attr("checked", this.checked);
                });
            });

            function Grid_onError(args) {
                if (args.textStatus == "modelstateerror" && args.modelState) {
                    var message = "Errors:\n";
                    $.each(args.modelState, function (key, value) {
                        if ('errors' in value) {
                            $.each(value.errors, function () {
                                message += this + "\n";
                            });
                        }
                    });
                    args.preventDefault();
                    alert(message);
                }
            }

            function Grid_onDataBinding(e) {
                var loadData = true;
                var grid = $(this).data('tGrid');

                if (loadData) {
                    var searchModel = {
                        Event: $('#select-event').val()
                    };
                    e.data = searchModel;
                }
            }

            function Grid_onSubmitChanges(e) {
                //TODO pass current search parameters

                //we can't pass search parameters in submit changes
                //that's why let's just clear search params
                //$('#@Html.FieldIdFor(model => model.Event)').val('');
                //$('#SearchCategoryId').val('0');
                //$('#SearchManufacturerId').val('0');
            }
        </script>
    </td>

我的控制器操作

  public ActionResult EmailReminder()
    {
        if (!_permissionService.Authorize(StandardPermissionProvider.ManageCustomers))
            return AccessDeniedView();

        var model = new NotificationMailReminderModels();

        model.Event = 0;

        List<Nop.Core.Domain.Catalog.Product> products = _productRepository.Table.Where(p => p.EventDate != null && p.EventDate >= DateTime.MinValue).OrderBy(o => o.Name).ToList();


        model.Events = products.Select(p => new System.Web.Mvc.SelectListItem
        {
            Text = p.Name.Trim(),
            Value = p.Id.ToString()
        }).ToList();

        return View(model);
    }

[HttpPost，GridAction（EnableCustomBinding = true）] public ActionResult EmailReminderByEvent（int [] Id，GridCommand command，NotificationMailReminderModels model） { if（！_permissionService.Authorize（StandardPermissionProvider.ManageCustomers））返回AccessDeniedView（）;

        var gridModel = new GridModel();

        string vwSlEv = ViewBag.SelectedEvent;
        int selevent = 0;
        if (!string.IsNullOrEmpty(vwSlEv))
        {
            Int32.TryParse(vwSlEv, out selevent);
        }
        else
        {
            selevent = model.Event;
        }

        var csts = _customerEventRoleRepository.Table.Where(e => e.EventId == selevent).Select(cs => cs.CustomerId).Distinct().ToArray();

        var customers = _customerRepository.Table.Where(c => !string.IsNullOrEmpty(c.Username) && !string.IsNullOrEmpty(c.Email) && csts.Contains(c.Id)).ToList();

        var gridmodel = customers.Select(x =>
        {
            NotificationMailReminderModel not = new NotificationMailReminderModel();
            not.Id = x.Id;
            not.Username = x.Username;
            not.Firstname = x.CustomerAttributes.FirstName;
            not.Lastname = x.CustomerAttributes.LastName;

            return not;
        });



        var grddata = new PagedList<NotificationMailReminderModel>(gridmodel.ToList(), command.Page - 1, command.PageSize);

        gridModel.Data = grddata;

        gridModel.Total = grddata.TotalCount;

        return new JsonResult
        {
            Data = gridModel
        };
    }

数据网格排序和过滤在我的网格中运行良好。但我无法获得ContextMenu

在Razor intellisence中起作用。

我想将所选行传递给Controller POST函数。

但是，如何将选定的行传递给控制器函数。

请帮忙。

Answer 1

但是，如何将选定的行传递给控制器函数。

JQuery（示例代码）

var MyConnectionList = {
    ColorList: []
};

function SendStream() {
    debugger;

    MyConnectionList.ColorList.push({
        "Name": 'Test1',
        "Color": 'red'
    });

    MyConnectionList.ColorList.push({
        "Name": 'Test2',
        "Color": 'Green'
    });

    $.ajax({
        url: "Ur url",
        data: JSON.stringify(MyConnectionList),
        type: 'POST',
        contentType: 'application/json',
        dataType: 'json',
        success: function (data) { }
    });
}

行动方法

public ActionResult SendStream(List<Sample> ColorList)
{
}

在nopCommerce Telerik网格中传递控制器中的选定行

1 个答案: