Question

我是kendoui的新手，当用户点击按钮选择要在网格中显示的新团队时，我花了一些时间尝试刷新网格。网格在初始剃刀页面加载时为团队1加载正确的数据，但在按钮单击选择另一个团队时重新执行。 Fiddler表示没有对服务器的调用。

这是我的剃刀页面代码：

@model IEnumerable<AFLFootball.ViewModels.PlayerViewModel>
@{
    ViewBag.Title = "Players";
}
<script>

    function teamFilter(element) {
        element.kendoDropDownList({
            datasource: {
                transport: {
                    read: "@Url.Action("/Player/FilterMenuCustomization_Teams")"
                }
            },
            optionLabel: "--Select Value--"
        });
    }

</script>
<h2>Player Data</h2>
<div>
    <ul class="nav nav-pills ">

        <li><button class="k-button" id="adelButton" type="button" data-id="1">Adel</button></li>
        <li><button class="k-button" id="brisButton" type="button" data-id="2">Bris</button></li>
        <li><button class="k-button" id="carlButton" type="button" data-id="3">Carl</button></li>
        <li><button class="k-button" id="collButton" type="button" data-id="4">Coll</button></li>
        <li><button class="k-button" id="essButton" type="button" data-id="5">Ess</button></li>
        <li><button class="k-button" id="freoButton" type="button" data-id="6">Freo</button></li>
        <li><button class="k-button" id="geeButton" type="button" data-id="7">Gee</button></li>
        <li><button class="k-button" id="gcsButton" type="button" data-id="8">Suns</button></li>
        <li><button class="k-button" id="gwsButton" type="button" data-id="9">GWS</button></li>
        <li><button class="k-button" id="hawButton" type="button" data-id="10">Haw</button></li>
        <li><button class="k-button" id="melButton" type="button" data-id="11">Mel</button></li>
        <li><button class="k-button" id="nmButton" type="button" data-id="12">NM</button></li>
        <li><button class="k-button" id="paButton" type="button" data-id="13">PA</button></li>
        <li><button class="k-button" id="richButton" type="button" data-id="14">Rich</button></li>
        <li><button class="k-button" id="stkButton" type="button" data-id="15">StK</button></li>
        <li><button class="k-button" id="sydButton" type="button" data-id="16">Syd</button></li>
        <li><button class="k-button" id="wceButton" type="button" data-id="17">WCE</button></li>
        <li><button class="k-button" id="wbButton" type="button" data-id="18">WB</button></li>

    </ul>
</div>
<div class="table table-condensed table-striped col-md-5">
    @(Html.Kendo().Grid<AFLFootball.ViewModels.PlayerViewModel>()
    .Name("grid")
    .Columns(columns =>
    {
        columns.Bound(p => p.TeamID).ClientTemplate("#=Team.TeamName#")
                        .Filterable(filterable => filterable.UI("teamFilter"))
                        .Width(100);
        //columns.Bound(p => p.TeamID).Title("Team").Width(150);
        columns.Bound(p => p.GNumber).Width(30).Filterable(false);
        columns.Bound(p => p.FirstName).Width(70).Filterable(false);
        columns.Bound(p => p.LastName).Width(70);
        columns.Bound(p => p.Listed).Title("Debut").Width(50).Filterable(false);
        columns.Bound(p => p.Recruited).Title("Recruited From").Width(100).Filterable(false);
        columns.Bound(p => p.Active).ClientTemplate("<input type='checkbox' #= Active ? checked='checked' :'' # />").Title("Current").Width(30);
        columns.Command(command => { command.Edit(); command.Destroy(); }).Width(160);
    })
        .ToolBar(toolbar => toolbar.Create())
        .Editable(editable => editable.Mode(GridEditMode.PopUp))
        .Sortable()
        .Scrollable()
        .Pageable()
        .Filterable(filterable => filterable
                .Extra(false)
                .Operators(operators => operators
                    .ForString(str => str.Clear()
                        .IsEqualTo("Is equal to")
                        .IsNotEqualTo("Is not equal to")
                    ))
                ).HtmlAttributes(new { style = "height:540px;" })
        .DataSource(dataSource => dataSource
            .Ajax()
            .Batch(false)
            .ServerOperation(false)
            .PageSize(9)
            .Events(events => events.Error("error_handler"))
            .Model(model =>
            {
                model.Id(p => p.Id);
                model.Field(p => p.Id).Editable(false);
                model.Field(p => p.GNumber);
                model.Field(p => p.FirstName);
                model.Field(p => p.LastName);
                model.Field(p => p.Listed);
                model.Field(p => p.Recruited);
                model.Field(p => p.Active);
            })
            .Create(update => update.Action("Create", "Player"))
                    .Read(read => read.Action("GetPlayers", "Player", new { team = 1 }))
                    .Update(update => update.Action("Edit", "Player"))
                    .Destroy(update => update.Action("Delete", "Player"))
        )
    )
</div>
<script type="text/javascript">
    function error_handler(e) {
        if (e.errors) {
            var message = "Errors:\n";
            $.each(e.errors, function (key, value) {
                if ('errors' in value) {
                    $.each(value.errors, function () {
                        message += this + "\n";
                    });
                }
            });
            alert(message);
        }
    };



    $(document).ready(function () {

        $("#adelButton").click(function () {
            var newUrl = "/Player/GetPlayers/?team = 1";
            $("#grid").data("kendoGrid").dataSource.transport.options.read.url = newUrl;
        });
        $("#brisButton").click(function () {
            var newUrl = "/Player/GetPlayers/?team = 2";
            $("#grid").data("kendoGrid").dataSource.transport.options.read.url = newUrl;
        });
        $("#carlButton").click(function () {
            var newUrl = "/Player/GetPlayers/?team = 3";
            $("#grid").data("kendoGrid").dataSource.transport.options.read.url = newUrl;
        });
        $("#collButton").click(function () {
            var newUrl = "/Player/GetPlayers/?team = 4";
            $("#grid").data("kendoGrid").dataSource.transport.options.read.url = newUrl;
        });
        $("#essButton").click(function () {
            var newUrl = "/Player/GetPlayers/?team = 5";
            $("#grid").data("kendoGrid").dataSource.transport.options.read.url = newUrl;
        });
        $("#freoButton").click(function () {
            var newUrl = "/Player/GetPlayers/?team = 6";
            $("#grid").data("kendoGrid").dataSource.transport.options.read.url = newUrl;
        });
        $("#geeButton").click(function () {
            var newUrl = "/Player/GetPlayers/?team = 7";
            $("#grid").data("kendoGrid").dataSource.transport.options.read.url = newUrl;
        });
        $("#gcsButton").click(function () {
            var newUrl = "/Player/GetPlayers/?team = 8";
            $("#grid").data("kendoGrid").dataSource.transport.options.read.url = newUrl;
        });
        $("#gwsButton").click(function () {
            var newUrl = "/Player/GetPlayers/?team = 9";
            $("#grid").data("kendoGrid").dataSource.transport.options.read.url = newUrl;
        });
        $("#hawButton").click(function () {
            var newUrl = "/Player/GetPlayers/?team = 10";
            $("#grid").data("kendoGrid").dataSource.transport.options.read.url = newUrl;
        });
        $("#melButton").click(function () {
            var newUrl = "/Player/GetPlayers/?team = 11";
            $("#grid").data("kendoGrid").dataSource.transport.options.read.url = newUrl;
        });
        $("#nmButton").click(function () {
            var newUrl = "/Player/GetPlayers/?team = 12";
            $("#grid").data("kendoGrid").dataSource.transport.options.read.url = newUrl;
        });
        $("#paButton").click(function () {
            var newUrl = "/Player/GetPlayers/?team = 13";
            $("#grid").data("kendoGrid").dataSource.transport.options.read.url = newUrl;
        });
        $("#richButton").click(function () {
            var newUrl = "/Player/GetPlayers/?team = 14";
            $("#grid").data("kendoGrid").dataSource.transport.options.read.url = newUrl;
        });
        $("#stkButton").click(function () {
            var newUrl = "/Player/GetPlayers/?team = 15";
            $("#grid").data("kendoGrid").dataSource.transport.options.read.url = newUrl;
        });
        $("#sydButton").click(function () {
            var newUrl = "/Player/GetPlayers/?team = 16";
            $("#grid").data("kendoGrid").dataSource.transport.options.read.url = newUrl;
        });
        $("#wceButton").click(function () {
            var newUrl = "/Player/GetPlayers/?team = 17";
            $("#grid").data("kendoGrid").dataSource.transport.options.read.url = newUrl;
        });
        $("#wbButton").click(function () {
            var newUrl = "/Player/GetPlayers/?team = 18";
            $("#grid").data("kendoGrid").dataSource.transport.options.read.url = newUrl;
        });
    });

</script>

任何想法都将不胜感激

Answer 1

两个问题：

您只需更改点击处理程序中的传输网址即可。这不会自动为您获取数据。您也需要拨打$("#grid").data("kendoGrid").dataSource.read()或$("#grid").data("kendoGrid").dataSource.fetch()（更改网址后）。
您在网址中的team参数周围有空格;你应该删除它们。

kendoui grid datasource读取不调用服务器

1 个答案: