jQWidgets jqxKanban ready属性详解
jQWidgets jqxKanban
是一种看板控件,用于在 Web 应用程序中创建看板。ready
属性是 jqxKanban
控件的一个属性,用于在控件准备好后触发。本文将详细讲解 ready
属性的使用方法,并提供两个示例说明。
属性
ready
属性在 jqxKanban
控件准备好后触发。该属性提供了一个回调函数,可以在控件准备好后执行一些操作。
// 监听 ready 属性
$("#jqxKanban").on("ready", function () {
// 控件准备好后执行的操作
});
在上述代码中,我们使用 on
方法监听 ready
属性,并在回调函数中执行控件准备好后的操作。
示例
以下是两个示例,演示如何使用 ready
属性。
示例 1
在此示例中,我们创建了一个 jqxKanban
控件,并使用 ready
属性在控制台中打印控件准备好的消息。
<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" }
]
});
// 监听 ready 属性
$("#jqxKanban").on("ready", function () {
console.log("jqxKanban 控件已准备好");
});
});
</script>
在上述代码中,我们创建了一个 jqxKanban
控件,并使用 ready
属性在控制台中打印控件准备好的消息。
示例 2
在此示例中,我们创建了一个 jqxKanban
控件,并使用 ready
属性在控制台中打印控件准备好的消息,并在控件准备好后添加一个新的看板项。
<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" }
]
});
// 监听 ready 属性
$("#jqxKanban").on("ready", function () {
console.log("jqxKanban 控件已准备好");
// 添加一个新的看板项
var newItem = {
id: "newItem",
status: "new",
text: "New Item"
};
$("#jqxKanban").jqxKanban("addItem", newItem);
});
});
</script>
在上述代码中,我们创建了一个 jqxKanban
控件,并使用 ready
属性在控制台中打印控件准备好的消息,并在控件准备好后添加一个新的看板项。
以上是 jqxKanban
的 ready
属性的详细,以及两个示例说明。在示例中,我们使用 ready
属性监听控件准备好的操作,并在回调函数中执行一些操作。