Telerik MVC网格带有信号事件未射击

Question

i具有信号绑定的Telerik MVC网格。我希望在给定列（ EventHexCode ）中有条件地为记录上色。为此，我需要在数据库上启动事件。我已经在Ajax数据源中使用了很多次，而没有任何发射事件的问题。但是对于我的一生，我无法通过SignalR数据源来触发数据库事件。

过去，我已经使用了这种方法来实现这一目标：https：//docs.telerik.com/kendo-ui/controls/data-management/grid/how-to/how-to/layout/layo-Style-rows-cells-cells-cells-cells--cells-基于data-item-values＃iTerate-the-table行

这是我的观点：

@(Html.Kendo().Grid<DirectOrderTracker.Models.ViewModels.TempOrderViewModel>()
        .Name("grid")
        .ToolBar(toolBar =>
        {
            toolBar.Create();
            // toolBar.Save();
        })
        .Filterable(ftb =>
        {
            ftb.Extra(false);
            ftb.Operators(op =>
            {
                op.ForString(str =>
                {
                    str.Clear().Contains("Contains");
                });
            });
        })
        .Editable(editable => editable.Mode(GridEditMode.InCell))
        .Pageable()
        .Events(e => { e.DataBound("onDataBound"); })
        .Navigatable()
        .Sortable()
        .Scrollable()
        .HtmlAttributes(new { style = "height:650px;" })
        .Columns(columns =>
        {
            columns.Bound(p => p.TempOrderID).Hidden();
            columns.Bound(p => p.EventHexCode).ClientTemplate("<span style='display: inline-block; width: 100%; height: 100%; background-color: #= EventHexCode #'>&nbsp;</span>").EditorTemplateName("ColorPicker").Width(120);
            columns.ForeignKey(p => p.CustCode, (System.Collections.IEnumerable)ViewData["defaultCustCode"], "CustCode", "CustDesc").Title("Customer").EditorTemplateName("CustDescAutoComplete").Width(180);
            columns.Bound(p => p.PONum).Title("Our PO#").Width(90);
            columns.Bound(p => p.CustRef).Title("Cust Ref#").Width(90);
            columns.Bound(p => p.ApptTime).Title("Appt").Width(70).Filterable(x => x.UI(GridFilterUIRole.TimePicker));
            columns.Bound(p => p.Qty).Width(65).Filterable(false);
            columns.ForeignKey(p => p.ProdNum, (System.Collections.IEnumerable)ViewData["defaultProdNum"], "ProdNum", "ProdDesc").Width(130).Title("Size/Spec").EditorTemplateName("ProdNumAutoComplete");
            columns.Bound(p => p.SalePrice).Format("{0:c}").Width(75).Title("Price").Filterable(false);
            columns.Bound(p => p.SONum).Title("Our SO#").Width(120);
            columns.Bound(p => p.DueDate).Format("{0:MM/dd/yyyy}").Width(120).Title("Due Date");
            columns.Bound(p => p.LoadDate).Format("{0:MM/dd/yyyy}").Width(120).Title("Load Date");
            columns.ForeignKey(p => p.VendCode, (System.Collections.IEnumerable)ViewData["defaultVendCode"], "VendCode", "VendDesc").Title("Vendor").EditorTemplateName("VendDescAutoComplete").Width(130);
            columns.Bound(p => p.Cost).Format("{0:c}").Width(75).Title("Cost").Filterable(false);
            columns.Bound(p => p.Manifest).Title("Mani").Width(55);
            columns.Bound(p => p.VendPO).Title("Ven PO#").Width(120);
            columns.Bound(p => p.VendRef).Title("Ven Ref#").Width(120);
            columns.ForeignKey(p => p.CarrCode, (System.Collections.IEnumerable)ViewData["defaultCarrCode"], "CarrCode", "CarrDesc").EditorTemplateName("CarrDescAutoComplete").Title("Truck").Width(120);
            columns.Bound(p => p.FrghtRate).Format("{0:c}").Width(75).Title("Frght").Filterable(false);
            columns.Bound(p => p.Comment).Title("Comment").Width(120);
            columns.Command(command =>
            {
                //   command.Edit();
                command.Destroy();
            }).Width(110);
        })
        .DataSource(dataSource => dataSource
                                        .SignalR()
                                        .AutoSync(true)
                                        .Events(events => events.Push(@<text>
                                            function(e) {
                                           // var notification = $("#notification").data("kendoNotification");
                                          //  notification.success(e.type);
                                            }
                                        </text>))
                                            .PageSize(24)
                                            .Transport(tr => tr
                                                .Promise("hubStart")
                                                .Hub("hub")
                                                .Client(c => c
                                                        .Read("read")
                                                        .Create("create")
                                                        .Update("update")
                                                        .Destroy("destroy"))
                                                .Server(s => s
                                                        .Read("read")
                                                        .Create("create")
                                                        .Update("update")
                                                        .Destroy("destroy"))
                                            )
                                            .Schema(schema => schema
                                            .Model(model =>
                                            {
                                                model.Id(p => p.TempOrderID);
                                                model.Field(p => p.CustCode).Editable(true);
                                                model.Field(p => p.DueDate).Editable(true);
                                                model.Field(p => p.LoadDate).Editable(true);
                                                model.Field(p => p.ProdNum).Editable(true);
                                                model.Field(p => p.Qty).Editable(true);
                                                model.Field(p => p.CarrCode);
                                                model.Field(p => p.VendCode).Editable(true);
                                                model.Field(p => p.SalePrice).Editable(true);
                                            }
                                            ))))

这是JavaScript：

<script>
    function onDataBound(arg) {
     alert("Grid data bound");
    }
</script>

总而言之，我希望有条件地为行着色。为此，我需要触发数据库事件，然后浏览表并更新CSS。你们怎么看？

Answer 1

好吧，非常愚蠢的错误。我在这个项目中有多个网格，它们都共享相同的JavaScript文件。我没有意识到我已经宣布了" onDatabound"功能。

我重命名为" ondataboundtemporders"的网格事件，并编写了适当的JavaScript。

这最终是解决方案：

 .Events(events => events.DataBound("onDataBoundTempOrders"))

JavaScript：

function onDataBoundTempOrders(e) {
    var grid = this;
    grid.tbody.find('>tr').each(function () {
        var dataItem = grid.dataItem(this);
        $(this).css("background-color",  dataItem.EventHexCode);
    });
    $("#grid tr.k-alt").removeClass("k-alt");
}

现在，当用户选择十六进制颜色时，它会存储在表中。十六进制代码通过jQuery应用于表行。像冠军