博客

jQWidgets jqxKanban getColumnItems()方法

  • Post category:jquery

jQWidgets jqxKanban getColumnItems() 方法详解

jQWidgets jqxKanban 是一种看板控件，用于在 Web 应用程序中创建看板。getColumnItems() 方法是 jqxKanban 控件的一个方法，用于获取指定列的所有项。本文将详细讲解 getColumnItems() 方法的使用方法，并提供两个示例说明。

方法

getColumnItems()用于获取指定列的所有项。该方法接受一个参数 column，表示要获取项的列的数据字段。该方法返回一个数组，包含指定列的所有项。

// 获取指定列的所有项
var items = $("#jqxKanban").jqxKanban("getColumnItems", "new");

在上述代码中，我们使用 getColumnItems() 方法获取了 jqxKanban 控件中数据字段为 new 的列的所有项，并将其存储在 items 变量中。

示例

以下是两个示例，演示如何使用 getColumnItems() 方法获取指定列的所有项。

示例 1

在此示例中，我们创建了一个 jqxKanban 控件，并使用 getColumnItems() 方法获取了数据字段为 new 的列的所有项。我们将所有项的文本输出到控制台。

<div id="jqxKanban"></div>

<script>
    $(document).ready(function () {
        // 创建 jqxKanban 控件
        $("#jqxKanban").jqxKanban({
            source: new $.jqx.dataAdapter(source),
            columns: [
                { text: "Backlog", dataField: "new" },
                { text: "In Progress", dataField: "work" },
                { text: "Done", dataField: "done" }
            ]
        });

        // 获取指定列的所有项
        var items = $("#jqxKanban").jqxKanban("getColumnItems", "new");

        // 输出所有项的文本到控制台
        for (var i = 0; i < items.length; i++) {
            console.log(items[i].text);
        }
    });
</script>

在上述代码中，我们创建了一个 jqxKanban 控件，并使用 getColumnItems() 方法获取了数据字段为 new 的列的所有项。我们将所有项的文本输出到控制台。

示例 2

在此示例中，我们创建了一个 jqxKanban 控件，并使用 getColumnItems() 方法获取了数据字段为 work 的列的所有项。我们将所有项的文本输出到页面上。

<div id="jqxKanban"></div>
<div id="items"></div>

<script>
    $(document).ready(function () {
        // 创建 jqxKanban 控件
        $("#jqxKanban").jqxKanban({
            source: new $.jqx.dataAdapter(source),
            columns: [
                { text: "Backlog", dataField: "new" },
                { text: "In Progress", dataField: "work" },
                { text: "Done", dataField: "done" }
            ]
        });

        // 获取指定列的所有项
        var items = $("#jqxKanban").jqxKanban("getColumnItems", "work");

        // 将所有项的本输出到页面上
        var itemsHtml = "";
        for (var i = 0; i < items.length; i++) {
            itemsHtml += items[i].text + "<br>";
        }
        $("#items").html(itemsHtml);
    });
</script>

在上述代码中，我们创建了一个 jqxKanban 控件，并使用 getColumnItems() 方法获取了数据字段为 work 的列的所有项。我们将所有项文本输出到页面上。

以上是 jqxKanban 的 getColumnItems() 方法的详细说明，以及两个示例说明。在示例中，我们使用 getColumnItems() 方法获取了指定列的所有项，并将其输出到控制台或页面上。

Tags: