1

我们正在开发一个使用 Kendo UI 的网络应用程序项目。是否可以将第一列标题/标题作为我们从下拉列表中选择的内容。例如:- 如果搜索序列号,则序列号应位于搜索的第一列。但我无法得到这一点,因为我们通常以排序方式定义列定义。根据选择,我们隐藏列的其余部分。例如:

xxx.GridColDef = [ {
    field : "serialNo",
    title : "Serial No",

}, {
    field : "firstname",
    title : "firstname",
    }, {
    field : "lastnameo",
    title : "lastname",
    }, 

如果我选择名字,则从下拉列表中,名字应该在第一列。但我得到第一列作为序列号有什么办法吗?无需为每个添加单独的列定义。

剑道版——2012.1.322

这应该自动完成,而不是使用列重新排序而不是手动


对不起,如果我不清楚。我想要的是

在下拉我有

序列号 名 姓 出生日期

最初的网格将如下所示

序列号 名 姓 出生日期

如果用户从下拉列表中选择“名字”,它应该是这样的

名字 序列号 姓氏 DOB

希望这可以帮助。如果您需要更多说明,请告诉我。感谢您为此提供解决方案。

还有一件事: -

“使用您当前版本的 Kendo 2012.1.322 小提琴”在此小提琴中,我无法从下拉列表中进行选择。

4

1 回答 1

1

更新答案 2

当前的 KendoUI 网格框架不支持在代码中切换列的功能。我创建了一个新的小提琴,您不必在每个 switch case 中完全重新排序列。它遍历您的列定义,如果存在下拉值,则将其从数组中删除并将其放置在第一个位置。我不知道你的 50 列和 8 个下拉菜单是如何相互作用的,所以我很难给出一个完全准确的答案。但是在这里的多个建议之间,我希望你能找到一个解决方案:)

我创建了一个新的 tempColumn 定义变量,以便原始列定义在其原始状态下仍然可用。

function onSelect(e) {
    var ddlVal = this.dataItem(e.item.index()).value;
    var tempColumns = columnDefinitions;

    $(tempColumns).each(function(index) {
        if (ddlVal == this.title) {
            tempColumns.splice(index, 1);
            tempColumns.splice(0, 0, this);
        }
    });

    createGrid(tempColumns);

}

使用香料重新排序列的新小提琴

更新的答案

我用你当前版本的剑道创建了一个新的小提琴。您不需要更新您的版本,因为我认为在 Kendo 框架内没有任何方法可以做到这一点。

此解决方案涉及在您从下拉列表中进行选择时重新定义列定义,然后重新创建网格。

使用您当前版本的剑道更新小提琴

*出于某种原因,Internet Explorer 有时不能很好地与 jsfiddle 配合使用。此示例适用于 Firefox 和 Chrome,但不适用于 IE。如果您无法尝试使用其他浏览器来查看它是否正常工作,请将代码插入您的解决方案并进行测试。

原始答案

我提供了两种不同的解决方案。

1) 您可以更新您的 KendoUI 版本吗?如果可以,那么您可以利用 .showColumn() 和 .hideColumn() 方法。

下面是使用 KendoUI 2012.2.710 的小提琴。在下拉的选择事件中,您只需显示/隐藏相应的列。真的很容易和直接。

小提琴使用剑道 2012.2.710

2) 如果您无法更新您的 KendoUI 版本,您可以更改您的 columnDefinition 数组,然后重新创建网格。

在下拉列表的 onSelect 方法中,从 columnDefinition 数组中删除第一列,然后将新的列对象添加到数组中。之后,您删除网格的 div 元素的内容,然后重新创建网格。

您仍然绑定到相同的数据,因此您不必通过网络再次获取数据。

使用您当前版本的 Kendo 2012.1.322 小提琴

~ 在这两种情况下,绝对可以清理代码以更好地满足您的需求,但我只是想为您提供一些基本功能。希望这可以帮助!

于 2012-10-16T22:43:55.000 回答