-1

私はASP.NETMVC3のTelerikGridの初心者です。ドロップダウンリストで選択した値でグリッドをバインドしようとしています。以下の私のコードをご覧ください。

私のWebモデルクラス

public class CustomerEventRolesModels
{
    public int Event { get; set; }
    public IEnumerable<System.Web.Mvc.SelectListItem> Events { get; set; }
    public Telerik.Web.Mvc.GridModel<CustomerEventRolesModel> GridData { get; set; }
}

public class CustomerEventRolesModel : BaseNopEntityModel
{
    public string Customer { get; set; }
    public bool Sponsor { get; set; }
    public bool Speaker { get; set; }
}

私の.cshtml

<table id="grdCustomerEventRoleData" class="adminContent" style="display: none">
<tr>
    <td>
        <p>
        </p>
    </td>
</tr>
<tr>
    <td>
        @(Html.Telerik().Grid<CustomerEventRolesModel>(Model.GridData.Data)
    .Name("grdCustomerEventRoles")
              .Columns(columns =>
              {

                  columns.Bound(x => x.Customer);

                  columns.Bound(x => x.Speaker).Template(x => Html.CheckBox("spk", x.Speaker));
                  columns.Bound(x => x.Sponsor).Template(x => Html.CheckBox("spn", x.Sponsor));
              }
        )   .Pageable(settings => settings.Total(Model.GridData.Total)
                        .PageSize(gridPageSize)
                        .Position(GridPagerPosition.Both))
                        .ClientEvents(events => events.OnDataBinding("onDataBinding"))
                        .DataBinding(dataBinding => dataBinding.Ajax().Select("FilterByDropdown", "Customer"))
                        .EnableCustomBinding(true))
        ) )
    </td>
</tr>

<script type="text/javascript">
var initialLoad = true;
$("#select-event").change(function () {
    if ($("#select-event option:selected").val() > 0) {
        $("#grdCustomerEventRoleData").show();
        $("#grdCustomerEventRoles").data("tGrid").rebind();
    }
    else {
        $("#grdCustomerEventRoleData").show();
    }
});

function onDataBinding(e) {
    if (initialLoad == true) {
        e.preventDefault();
        initialLoad = false;
    }
    else {
        var classificationId = $("#select-event option:selected").val();
        if (classificationId != "")
            e.data = $.extend(e.data, {
                selEvent: classificationId
            });
        else {
            e.preventDefault();
            $("#grdCustomerEventRoleData").hide();
        }
    }

}

コントローラのアクション

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

        var model = new CustomerEventRolesModels();

        model.Event = 0;

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

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

        var grdmodel = new GridModel<CustomerEventRolesModel>
        {
            Data = null,
            Total = 0
        };

        model.GridData = grdmodel;

        return View(model);
    }

    [HttpPost, GridAction(EnableCustomBinding = true)]
    public ActionResult FilterByDropdown(GridCommand command, int selEvent)
    {
        if (!_permissionService.Authorize(StandardPermissionProvider.ManageCustomers))
            return AccessDeniedView();

        if (selEvent == 0)
            return View();

        var model = new CustomerEventRolesModels();

        model.Event = selEvent;

        var roles = (from lst in _customerEventRoleRepository.Table
                     join cust in _customerRepository.Table on lst.CustomerId equals cust.Id
                     join product in _productRepository.Table on lst.EventId equals product.Id
                     join role in _customerRoleRepository.Table on lst.RoleId equals role.Id
                     orderby lst.Id descending
                     select new CustomerEventRolesModel
                     {
                         Id = lst.Id,
                         Customer = cust.Email,
                         Sponsor = (role.Name == "Sponsor") ? true : false,
                         Speaker = (role.Name == "Speaker") ? true : false
                     }).ToList();

        var grdmodel = new GridModel<CustomerEventRolesModel>
        {
            Data = roles,
            Total = roles.Count
        };

        model.GridData = grdmodel;

        return new JsonResult
        {
            Data = model
        };
    }

FilterByDropdownアクションは正しく機能しますが、グリッドはバインドされていません。

私は無知です。

助けてください。

4

2 に答える 2

1

間違ったモデルを返しています。

FilterByDropdown でこれを試してください:

    var grdmodel = new GridModel<CustomerEventRolesModel>
    {
        Data = roles,
        Total = roles.Count
    };

    return new JsonResult
    {
        Data = grdmodel
    };
于 2013-03-20T14:14:53.500 に答える
1

行を編集するときに Telerik MVC グリッドにドロップダウンを追加する場合は、次のいくつかの手順に従う必要があります (グリッドを ajax バインドし、行を編集可能にすることは別として)。

名前 (モデルの「名前」) を表す列を、名前を入力するのではなく選択できるドロップダウンにしたいとしましょう。グリッドがオンになっているビューを含むフォルダーに、「EditorTemplates」という名前のフォルダーを追加します。編集中の行に表示するドロップダウンごとに個別の部分ビューが含まれます。部分ビュー (上記) を作成し、「ClientName.cshtml」などの名前を付けます。これには、「Name」という名前の Telerik DropDownList が含まれ、必要な名前のリストにバインドされます。

@(Html.Telerik().DropDownList() .Name("Name") .BindTo(new SelectList((IEnumerable)ViewData["CustomerNames"], "Text", "Value")) )

次の属性を、グリッドが使用するデータ型の「名前」プロパティに追加します。たとえば、グリッドは「文字列名」フィールドを含む「顧客」クラスを使用します。

public class Customer{ [UIHint("ClientName"), Required] public string Name { get; set; } }

UIHint プロパティは、特定の列がレンダリングされるときに使用するフィールド テンプレートを指定します。

グリッド関数を含むページに次の Java スクリプトを追加します。 function onEditCustomerList(e) { if (e.dataItem != null) { $(e.form).find('#Name').data('tDropDownList').select(function (dataItem) { return dataItem.Text == e.dataItem['Name']; }); } }

これでうまくいくはずです。

于 2013-03-28T11:07:29.783 に答える