个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
如何通过使用 kendo ui 在子网格中选择一行来更新主(父)网格？我有一个父网格，它使用本地数据进行填充，并且单击添加新记录时有一个选项卡网格。我在子网格中选择一行，然后单击更新，数据必须绑定(bind)到父网格。我能够检索所选元素，但无法绑定(bind)到父网格数据源。请提供相同的建议。
<!DOCTYPE html>
<html>
<head>
<title>Popup editing</title>
<meta charset="utf-8">
<link href="css/examples-offline.css" rel="stylesheet">
<link href="css/kendo.common.min.css" rel="stylesheet">
<link href="css/kendo.rtl.min.css" rel="stylesheet">
<link href="css/kendo.default.min.css" rel="stylesheet">
<script src="../js/jquery.min.js"></script>
<script src="../js/kendo.web.min.js"></script>
<script src="../js/userMaintenance.js"></script>
<script src="../js/console.js"></script>
<script>
</script>
</head>
<body>
<center><h2 style="color:blue;">User Maintenance</h2> </center>
<!-- grid element -->
<div id="example" class="k-content">
<div id="grid" ></div>
<script>
var data = createRandomData(50);
var main = [{Globalid:"fdsdf",UserName:"System Admin",SystemRole:"5",Title:"5"},
{Globalid:"qwewqeqwe",UserName:"System Admin",SystemRole:"5",Title:"5"}
];
var mylocaldatasource=new kendo.data.DataSource({
data:main
});
mylocaldatasource.read();
$(document).ready(function() {
$("#grid").kendoGrid({
dataSource: {
data: data,
schema: {
model: {
fields: {
Globalid: { type: "string" },
UserName: { type: "string" },
SystemRole: { type: "string" },
Title: { type: "string" }
}
}
}
},
height: 430,
pageable: false,
editable: {
mode: "popup",
template: kendo.template($("#popup_editor").html())
},
toolbar: ["create"],
columns: [
{
field: "Globalid",
title: "Global id"
},
{
field: "UserName",
title: "User Name"
},
{
field: "SystemRole",
title: "System Role"
},
{
field: "Title",
title: "Title",
format: "{0:c}",
width: "100px"
},
{
command: ["edit", "Remove"],
title: " ",
width: "160px"
}
],
edit: function(e){
e.container.find(".nested-tabstrip").kendoTabStrip({});
e.container.find(".tabstrip-grid").kendoGrid({
dataSource: mylocaldatasource,
pageable: false,
selectable:true,
height: 300,
columns:[
{
field: "Globalid",
title: "Global id"
},
{
field: "UserName",
title: "User Name"
},
{
field: "SystemRole",
title: "System Role"
},
{
field: "Title",
title: "Title",
format: "{0:c}",
width: "100px"
}
],
change:grid_change
});
}
});
function grid_change(e) {
var selectedRows = this.select();
var selectedDataItems = [];
for (var i = 0; i < selectedRows.length; i++) {
var dataItem = this.dataItem(selectedRows[i]);
selectedDataItems.push(dataItem);
// var globalid=this.dataItem(this.select()).Globalid;
alert(this.dataItem(this.select()).Globalid);
}
// selectedDataItems contains all selected data items
}
var grid = $("#grid").data("kendoGrid");
grid.bind("change", grid_change);
grid.dataSource.add({
id:i+1,
Globalid: this.dataItem(this.select()).Globalid,
UserName: selectedDataItems.UserName,
SystemRole: selectedDataItems.SystemRole,
Title: selectedDataItems.Title
});
});
</script>
</div>
<!-- popup editor template -->
<script id="popup_editor" type="text/x-kendo-template">
<div class="nested-tabstrip">
<ul>
<li>
Search
</li>
<li>
Search Results
</li>
</ul>
<div>
<div class="Search">
<div class="k-edit-label">
<label for="Globalid">Global id:</label>
</div>
<div class="k-edit-field">
<input type="text" class="k-input k-textbox" name="Globalid" data-bind="value:Globalid">
</div>
<div class="k-edit-label">
<label for="UserName">User Name: </label>
</div>
<div class="k-edit-field">
<input name="UserName"
data-bind="value:UserName"
data-value-field="UserName"
/>
</div>
<div class="k-edit-label">System Role: </div>
<div class="k-edit-field">
<select name="SystemRole" >
<option value="PAA User">PAA User</option>
<option value="PAA Admin">PAA Admin</option>
<option value="Executive">Executive</option>
<option value="System Admin">System Admin</option>
</select>
</div>
<div class="k-edit-label">
<label for="Title">Title:</label>
</div>
<div class="k-edit-field">
<input type="text" name="Title" data-bind="value:Title" />
</div>
</div>
</div>
<div>
<div class="tabstrip-grid" id="childgrid"></div>
</div>
</div>
</body>
</html>
最佳答案
您可以编写类似这样的内容来定义子网格。
$("#ChildGrid tbody tr").on("click", function (e) {
var grid = $("#ChildGrid").data("kendoGrid");
var dataItem = grid.dataItem(grid.select())
window.parent.CallFromChild(dataItem);
});
在主网格中创建此函数:
function CallFromChild(dataItemFromChild){
var parentGrid = $("#ParentGrid").data("kendoGrid");
var parentDataItem = parentGrid.dataItem.set("ColumnName",dataItemFromChild.Value);
}
你可以尝试这样的事情。希望这会有所帮助。
关于jquery - 通过使用kendo在子网格中选择一行来将记录添加到父网格，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21696694/
25
4
0
我正在尝试在 Kendo 网格中获取 Kendo Tree 。 我可以实现获取数据，但不能实现树功能。 下面是相同的链接 http://dojo.telerik.com/oDakE 任何人都可以帮助我
我使用的是 Kendo Treeview ，在 Kendo Treeview 节点中，我嵌入了 Kendo 下拉菜单。 一切正常，下拉列表出现在 Treeview 节点上，但是当我展开 treevie
我在同一页面上有 TreeView 和 Grid，我需要从网格数据填充 TreeView。所以流程是这样的: 用户从下拉列表中选择某项内容并单击按钮 -> Web 服务调用 -> 使用来自 Web 服
我正在尝试在 Treeview 中嵌套一个窗口。我想要这样，当用户选择一个特定的节点时，它会打开一个 Kendo 窗口。有没有人做过这个？我在演示中没有看到太多类似的东西。 我正在使用 mvc 包装器
我想知道是否可以加载 kendo.View(...) 或 kendo.layout(...) 的内容一个单独的 html 文件？ 这是剑道的例子Hello World Single Page Appl
我有 Kendo HierarchicalDataSource绑定(bind)到 Kendo 的对象 treeview小部件。 HierarchicalDataSource只返回一个一级深度的 jso
我想为 kendo-grid-react-wrapper 引入类似 kendoDateRangePicker 的东西。有 kendoDatePicker 允许您只选择一个日期而不是两个: filter
我正在尝试将 Kendo UI MVVM 框架与 Kendo UI 拖放机制结合使用；但我很难找到如何将数据从 draggable 对象中删除。 我的代码是这样的...... var viewMode
我正在尝试最新的 Kendo UI Web 版本，以便在我们的应用程序中使用它，特别是网格组件。 如图here网格能够在移动设备或任何浏览器中进行自适应渲染，如果 mobile属性设置为“手机”或“平
Kendo UI Web 和 Kendo UI Core 之间有什么区别 https://www.nuget.org/packages/KendoUIWeb http://www.nuget.org/
我正在尝试将 Kendo UI MVVM 框架与 Kendo UI 拖放机制结合使用；但是我很难找到如何从 draggable 对象中删除数据。 我的代码是这样的…… var viewModel =
我正在尝试最新的 Kendo UI Web 版本，以便在我们的应用程序中使用它，特别是网格组件。 如图here网格能够在移动设备或任何浏览器中进行自适应渲染，如果 mobile属性设置为“手机”或“平
KendoUI 版本 2013.3.1119使用 Kendo MVVM 我有一个我构建的颜色选择器，它使用平面颜色选择器和使用调色板的颜色选择器。它们都可以正常运行，但平面颜色选择器的布局已关闭， s
我使用以下方法显示格式化为百分比的数值: columns.push( { field: key, hidden:
Hello 使用类似于此示例的复选框实现了自定义过滤器菜单: http://dojo.telerik.com/@SiliconSoul/oBoCu 我的问题是，如果用户选择/取消选择了一些复选框，但从
网格列可以调整大小。我想存储用户调整的列宽并在下一个 session 开始时恢复它们。 我发现存储列宽的最佳方法如下: var element = $('#grid').kendoGrid({
我有一个Kendo ui图表，该图表显示来自动态数据源的柱形图。但有时图表会打开可用空间大小的一半。当我单击某些链接或更改日期时，它会自动调整大小。知道为什么会导致它吗？ 在数据源更改事件中，当它显示
我发现 kendoui 图表有两种方法:refresh方法和redraw方法，有什么区别？我想他们俩都是再画一次图表。但是如果图表是根据 ajax 从远程数据绑定(bind)的，则请求不会再次触发。
我有一个包含太多列的剑道网格。最初我选择隐藏一些列，但后来我决定用水平滚动条显示所有列。 我通过为每一列分配宽度来做到这一点。当我这样做时，每列之间的行与标题行不同步。 我的意思是，网格数据部分的行相
enter image description here 我正在尝试使用带有复选框的 Treeview 来定义用户权限。 (2 个 Action - 启用/禁用正确) 如何从父节点获取值(id)？ K
我是一名优秀的程序员,十分优秀！