Hi Tsvetomir,
Sorry for not giving adequate details.
Yes, the master have a detail Template and within this detail Template there is a Tabstrip with two grids.
In theTab item(ie the ChildGrid ) we have a Grid ToolBar Template with a DatePicker and a Combo Box to filter the Grid values .
we dont require the Filter functionality of the Grid , we want an external control to filter. So I am not able to access the child grid from the DatePicker and Combo value Change event. In the attributeChage event , how to access the child Kendo Grid 2(There are two grids in the TabStrip)
The Code for the detail Template with the toolBar Template and is given Below:
<script id="secattributes" type="text/kendo-tmpl">
@(Html.Kendo().TabStrip()
.Name("tabStrip_#=MasterId#")
.SelectedIndex(0)
.Animation(animation => animation.Open(open => open.Fade(FadeDirection.In)))
.Items(items =>
{
items.Add().Text("Overlapping Attributes").Content(@<text>
@(Html.Kendo().Grid<CoreMaster.Models.OverlapView>()
.Name("OverlapSecurityAttribute_#=MasterId#")
.ToolBar(toolbar =>
{
toolbar.ClientTemplateId("GridToolbarTemplate");
})
.Editable(editable => editable.Mode(GridEditMode.InCell))
.Columns(cols =>
{
cols.Bound(y => y.Attribute).Title("Attribute");
cols.Bound(y => y.StartDate).Title("Start Date")
.Format("{0:yyyy/MM/dd}").EditorTemplateName("AttributeDate");
cols.Bound(y => y.EndDate).Title("End Date")
.Format("{0:yyyy/MM/dd}").EditorTemplateName("AttributeDate");
})
.DataSource(dataSource => dataSource
.Ajax().PageSize(5)
.Batch(true)
.Model(model =>
{
model.Id(p => p.SecurityAttributeId);
model.Field(p => p.StartDate);
model.Field(p => p.EndDate);
}) .
.Read(read => read.Action("OverlappingSecurity_Attributes_Read", "SecurityMaster").Data("paramters(#=SecurityMasterId#)"))
)
.ToClientTemplate() ) </text>);
}).ToClientTemplate())
</script>
@*Overlapping Attributes Tool Bar Template*@
<script id="GridToolbarTemplate" type="text/x-kendo-template">
<div class="CreateBtnCo">
<a class="k-button k-button-icontext k-grid-add" href='\\#'><span class="k-icon k-add"></span>Add new Attribute</a>
</div>
<div class="SaveBtnCo">
<a role='button' class='k-button k-button-icontext k-grid-save-changes' href='\\#'><span class='add-save-button'></span>Save Changes</a>
</div>
<div class="CancelBtnCo">
<a role='button' class='k-button k-button-icontext k-grid-cancel-changes' href='\\#'><span class='add-cancel-button'></span>Cancel Changes</a>
</div>
<div class="AttributeTypeContainer">
<label class="Attribute-Label" for="AttributeTypeName"> Attribute Type </label>
@(Html.Kendo().DropDownList()
.Name("TypeId")
.DataTextField("AttributeTypeName")
.DataValueField("AttributeTypeId")
.AutoBind(false)
.OptionLabel("All")
.Events(e => e.Change("AttributeChange"))
.HtmlAttributes(new { style = "width: 150px;" })
.DataSource(ds =>
{
ds.Read("AttributeTypesSecurity_Read", "AttributeType");
})
.ToClientTemplate()
)
</div>
<div class="Date">
@(Html.Kendo().DatePicker()
.Name("datepicker")
.Format("{0:yyyy/MM/dd}")
.HtmlAttributes(new { style = "width: 100%", title = "datepicker" })
.DateInput()
.Events(e => e.Change("DateChange"))
.ToClientTemplate()
)
</div>
</script>
<script type="text/javascript">
function AttributeChange() {
var value = this.value(),
grid = $("#OverlapSecurityAttribute_#=SecurityMasterId#").data("kendoGrid");
if (value) {
grid.dataSource.filter({ field: "AttributeId", operator: "eq", value: parseInt(value) });
} else {
grid.dataSource.filter({});
}
}
</script>