This question is locked. New answers and comments are not allowed.
hi there,
i have a simple grid with popup editing. the editor template contains a basic dropdownlist with an onchange event creating a basic window with a second, different grid with popup editing. calling the editor template of the first grid with the insert button everything goes fine, however editing an item and opening the window with the second grid from the dropdownlist causes a problem - calling the editor template of the second grid overrides the editor template of the first / underlying grid making it disappear and 'killing' the purpose of the first grid e.g. creating / editing a data item.
i have provided a basic, stripped down - quick and dirty - example displaying the issue described above.
first grid
@{
IEnumerable<ViewIndustrialSectorBase> viewIndustrialSectorBases = new [] {
new ViewIndustrialSectorBase { IndustrialSectorBaseId = "IndustrialSectorBaseId" }
};
}
@(
Html.Telerik().Grid<ViewIndustrialSectorBase>(viewIndustrialSectorBases)
.Name("IndustrialSectorBaseGrid")
.DataKeys(keys => {
keys
.Add(property => property.IndustrialSectorBaseId);
})
.ToolBar(commands => {
commands
.Insert()
.ButtonType(GridButtonType.Image);
})
.Editable(editing => {
editing
.Mode(GridEditMode.PopUp)
.TemplateName("PopUp");
})
.DataBinding(binding => {
binding
.Ajax()
.Insert("Create", "IndustrialSectorBase")
.Update("Update", "IndustrialSectorBase");
})
.Columns(columns => {
columns
.Command(commands => {
commands
.Edit()
.ButtonType(GridButtonType.Image);
})
.Width(47);
columns
.Bound(property => property.IndustrialSectorBaseId);
})
)
editor template of the first grid - PopUp.cshtml - with inline window and basic javascript
@(
Html.Telerik().DropDownList()
.Name("IndustrialSectorList")
.Placeholder("--- select an item ---")
.BindTo(
new[] {
new SelectListItem {
Text = "..."
}
}
)
.ClientEvents(events => {
events
.OnChange(
@<text>
function(event) {
$('#IndustrialSectorWindow').data('tWindow').center().open();
}
</text>
);
})
)
@(
Html.Telerik().Window()
.Name("IndustrialSectorWindow")
.Content(
Html.Partial("WindowContent").ToHtmlString()
)
.Visible(false)
)
second grid with automated editor template - WindowContent.cshtml
@using De.Foerch.Xtend.MasterData.Models.ViewModels
@{
IEnumerable<ViewIndustrialSector> viewIndustrialSectors = new [] {
new ViewIndustrialSector { IndustrialSectorId = 1 }
};
}
@(
Html.Telerik().Grid<ViewIndustrialSector>(viewIndustrialSectors)
.Name("IndustrialSectorGrid")
.DataKeys(keys => {
keys
.Add(property => property.IndustrialSectorId);
})
.ToolBar(commands => {
commands
.Insert()
.ButtonType(GridButtonType.Image);
})
.Editable(editing => {
editing
.Mode(GridEditMode.PopUp);
})
.DataBinding(binding => {
binding
.Ajax()
.Insert("Create", "IndustrialSector")
.Update("Update", "IndustrialSector");
})
.Columns(columns => {
columns
.Command(commands => {
commands
.Edit()
.ButtonType(GridButtonType.Image);
})
.Width(47);
columns
.Bound(property => property.IndustrialSectorId);
})
)
i hope i could make my point - thanks in advance ... best regards ismael.
i have a simple grid with popup editing. the editor template contains a basic dropdownlist with an onchange event creating a basic window with a second, different grid with popup editing. calling the editor template of the first grid with the insert button everything goes fine, however editing an item and opening the window with the second grid from the dropdownlist causes a problem - calling the editor template of the second grid overrides the editor template of the first / underlying grid making it disappear and 'killing' the purpose of the first grid e.g. creating / editing a data item.
i have provided a basic, stripped down - quick and dirty - example displaying the issue described above.
first grid
@{
IEnumerable<ViewIndustrialSectorBase> viewIndustrialSectorBases = new [] {
new ViewIndustrialSectorBase { IndustrialSectorBaseId = "IndustrialSectorBaseId" }
};
}
@(
Html.Telerik().Grid<ViewIndustrialSectorBase>(viewIndustrialSectorBases)
.Name("IndustrialSectorBaseGrid")
.DataKeys(keys => {
keys
.Add(property => property.IndustrialSectorBaseId);
})
.ToolBar(commands => {
commands
.Insert()
.ButtonType(GridButtonType.Image);
})
.Editable(editing => {
editing
.Mode(GridEditMode.PopUp)
.TemplateName("PopUp");
})
.DataBinding(binding => {
binding
.Ajax()
.Insert("Create", "IndustrialSectorBase")
.Update("Update", "IndustrialSectorBase");
})
.Columns(columns => {
columns
.Command(commands => {
commands
.Edit()
.ButtonType(GridButtonType.Image);
})
.Width(47);
columns
.Bound(property => property.IndustrialSectorBaseId);
})
)
editor template of the first grid - PopUp.cshtml - with inline window and basic javascript
@(
Html.Telerik().DropDownList()
.Name("IndustrialSectorList")
.Placeholder("--- select an item ---")
.BindTo(
new[] {
new SelectListItem {
Text = "..."
}
}
)
.ClientEvents(events => {
events
.OnChange(
@<text>
function(event) {
$('#IndustrialSectorWindow').data('tWindow').center().open();
}
</text>
);
})
)
@(
Html.Telerik().Window()
.Name("IndustrialSectorWindow")
.Content(
Html.Partial("WindowContent").ToHtmlString()
)
.Visible(false)
)
second grid with automated editor template - WindowContent.cshtml
@using De.Foerch.Xtend.MasterData.Models.ViewModels
@{
IEnumerable<ViewIndustrialSector> viewIndustrialSectors = new [] {
new ViewIndustrialSector { IndustrialSectorId = 1 }
};
}
@(
Html.Telerik().Grid<ViewIndustrialSector>(viewIndustrialSectors)
.Name("IndustrialSectorGrid")
.DataKeys(keys => {
keys
.Add(property => property.IndustrialSectorId);
})
.ToolBar(commands => {
commands
.Insert()
.ButtonType(GridButtonType.Image);
})
.Editable(editing => {
editing
.Mode(GridEditMode.PopUp);
})
.DataBinding(binding => {
binding
.Ajax()
.Insert("Create", "IndustrialSector")
.Update("Update", "IndustrialSector");
})
.Columns(columns => {
columns
.Command(commands => {
commands
.Edit()
.ButtonType(GridButtonType.Image);
})
.Width(47);
columns
.Bound(property => property.IndustrialSectorId);
})
)
i hope i could make my point - thanks in advance ... best regards ismael.