Hi,
I want a grid that has a button that opens a window that contains a grid that allows you to select a value for the parent grid
@(Html.ISGrid<Core.Data.Models.AttributeSourceSEModel>()
.Name(
"grid"
)
.Columns(columns =>
{
columns.Command(command => command.Custom(
"pick"
).Click(
"pickAttribute"
)).Width(50);
columns.Bound(p => p.AttributeSourceID).Width(200);
columns.Bound(p => p.Description).Width(200);
columns.Bound(p => p.SourceDataColumnName).Width(200);
columns.Bound(p => p.AttributeDefinitionID).Width(200);
columns.Bound(p => p.AttributeDefinitionName).Width(200);
columns.Bound(p => p.AttributeReportingGroupName).Width(200);
columns.Bound(p => p.AttributeHeaderName).Width(200);
columns.Bound(p => p.Name).Width(200);
//columns.Bound(p => p.AttributeSourceDatabaseID).Width(200);
columns.ForeignKey(p => p.AttributeSourceDatabaseID, (System.Collections.IEnumerable)ViewBag.AttributeSourceDatabase,
"ID"
,
"Name"
)
.Title(
"Database"
).Width(150);
columns.Bound(p => p.TableName).Width(200);
columns.Bound(p => p.SurveyEntityIDColumnName).Width(200);
columns.Bound(p => p.FilterColumnName).Width(200);
columns.Bound(p => p.FilterColumnValue).Width(200);
columns.Bound(p => p.Filter2ColumnName).Width(200);
columns.Bound(p => p.Filter2ColumnValue).Width(200);
columns.Bound(p => p.LastUpdatedDateColumnName).Width(200);
columns.Bound(p => p.RecommendedBatchSize).Width(200);
columns.Bound(p => p.VeracitySourceID).Width(200);
columns.Bound(p => p.VerificationTypeID).Width(200);
columns.Bound(p => p.VerificationTypeUnits).Width(200);
columns.Bound(p => p.IsInUse).Width(200);
columns.Bound(p => p.AttributeDataLogCount).Width(200);
columns.Command(command => command.Destroy()).Width(172);
})
.ToolBar(toolbar =>
{
toolbar.Create();
toolbar.Save();
toolbar.Excel();
})
.Editable(editable => editable.Mode(GridEditMode.InCell).CreateAt(GridInsertRowPosition.Bottom))
.Pageable()
.Groupable()
.Sortable()
.Scrollable()
.Filterable()
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Batch(
true
)
.Events(events => events.Error(
"error_handler"
))
.Model(model =>
{
model.Id(p => p.AttributeSourceID);
model.Field(p => p.AttributeDefinitionName).Editable(
false
);
})
.Create(update => update.Action(
"Create"
,
"AttributeSourceSE"
))
.Update(update => update.Action(
"Update"
,
"AttributeSourceSE"
))
.Destroy(update => update.Action(
"Destroy"
,
"AttributeSourceSE"
))
.Read(read => read.Action(
"Read"
,
"AttributeSourceSE"
,
new
{ attributeSourceDatabaseID = @Request[
"AttributeSourceDatabaseID"
] }))
)
)
@(Html.Kendo().Window()
.Name(
"AttDef"
)
.Title(
"Attribute Definition"
)
.Visible(
false
)
.Modal(
true
)
.Draggable(
true
)
.Content(
Html.ModalGrid<Core.Data.Models.AttributeDefinitionModel>()
.Name(
"attgrid"
)
.Events(events => events.Change(
"Grid_OnRowSelect"
))
.Columns(columns =>
{
columns.Bound(p => p.Name);
columns.Bound(p => p.AttributeReportingGroupName);
columns.Bound(p => p.AttributeHeaderName);
columns.Bound(p => p.AttributeDefinitionID).Hidden(
true
);
})
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Batch(
true
)
.Events(events => events.Error(
"error_handler"
))
.Model(model =>
{
model.Id(p => p.AttributeDefinitionID);
})
.Read(read => read.Action(
"ReadNameOnly"
,
"AttrDef"
,
new
{ AttributeReportingGroupID = @Request[
"AttributeReportingGroupID"
] }))
)
.ToHtmlString()
)
.Width(500)
.Height(500)
)
<script type=
"text/javascript"
>
function pickAttribute(e) {
window.grid = $(
"#grid"
).data(
"kendoGrid"
);
window.dataItem = window.grid.dataItem($(
event
.srcElement).closest(
"tr"
));
var wnd = $(
"#AttDef"
).kendoWindow({
title:
"Attribute Definition"
,
actions: [
"Minimize"
,
"Maximize"
,
"Close"
],
visible:
false
,
modal:
true
,
close: onClose
}).data(
"kendoWindow"
);
wnd.center();
wnd.open();
resizeGrid();
}
Grid_OnRowSelect = function (e) {
alert(
'onChange'
);
}
function onClose()
{
alert(
'close'
);
}
function resizeGrid() {
var gridElement = $(
"#attgrid"
);
var dataArea = gridElement.find(
".k-grid-content"
);
var newHeight = gridElement.parent().innerHeight() - 2;
var diff = gridElement.innerHeight() - dataArea.innerHeight();
gridElement.height(newHeight);
dataArea.height(newHeight - diff);
}
</script>
It is working up to the point where the window opens, but I cannot click on the child grid to return values to the parent grid.
The columns on the parent grid are read only. How do I update them in javascript?