Passing data to parent window from Kendo popup window

[John]

I am trying to pass data back from a Kendo window to the parent page or at least get a reference back to the parent page; but its not working.

Any help resolving this would be appreciated. Everything works except I cannot get a reference to the parent page to pass data to it. the grid on the parent page is not getting populated. 

<h5 class="bold"><a name="associates"></a>Known Associates</h5> 
        <div id="GridMessage_Associate" style="display: none;"></div>
 
        @(Html.Kendo().Grid<PeopleSearchResultDO>()
            .Name("AssociateGrid")
            .AutoBind(false)
            .HtmlAttributes(new { style = "display:none;" })
            .Columns(columns =>
            {
                columns.Bound(p => p.PersonId).ClientTemplate("#= PersonId #" + "<input type='hidden' name='PersonAssociates[#= indexAssociate(data) #].PersonId' value='#= PersonId #' />");
 
                columns.Bound(p => p.FirstName).ClientTemplate("#= FirstName #" + "<input type='hidden' name='PersonAssociates[#= indexAssociate(data) #].FirstName' value='#= FirstName #' />");
 
                columns.Bound(p => p.MiddleName).ClientTemplate("#= MiddleName #" + "<input type='hidden' name='PersonAssociates[#= indexAssociate(data) #].MiddleName' value='#= MiddleName #' />");
 
                columns.Bound(p => p.LastName).ClientTemplate("#= LastName #" + "<input type='hidden' name='PersonAssociates[#= indexAssociate(data) #].LastName' value='#= LastName #' />"); 
               
            }
            )
            .DataSource(
        dataSource => dataSource
                    .Ajax()
                    .ServerOperation(false)
             )
        )
 
        <br />
        <br />
 
 
        <!-- Modal -->
 
        <input id="openassociates" value="Search for an Associate" class="btn btn-default btn-lg" />
 
 
        @(Html.Kendo().Window()
        .Name("associatewindow")
        .Width(1400)
        .Height(500)
        .Draggable()
        .Resizable()
        .Title("Add New Person")
        .Visible(false)
        .Modal(true)
 
        .Actions(actions => actions
        .Minimize()
        .Maximize()
        .Close().Refresh()
    )
 
        .Content("loading associates ...")   
    .LoadContentFrom("LoadAssociatesForm", "Person")
    .Events(ev => ev.Close("onClose"))
        )
 
 
        <div class="responsive-message"></div>
 
 
        <script>
    function onClose() {
        $("#openassociates").show();
    }  
 
    $(document).ready(function () {
        $("#openassociates").bind("click", function () {
            $("#associatewindow").data("kendoWindow").open();
            $("#openassociates").hide();
        });
    });
        </script> 
 
 
        <p>
                    <input type="submit" id="btnPersonSave" value="Save" class="btn btn-lg btn-primary" />
                </p>
    }
</div>
 
 
<script type="text/javascript">
    function error_handler(e) {
        if (e.errors) {
            var message = "Errors:\n";
            $.each(e.errors, function (key, value) {
                if ('errors' in value) {
                    $.each(value.errors, function () {
                        message += this + "\n";
                    });
                }
            });
            alert(message);
        }
    }
 
    function indexAssociate(dataItem) {
        var data = $("#AssociateGrid").data("kendoGrid").dataSource.data();
        return data.indexOf(dataItem);
    }

 

Here is the content of the Kendo Window

@(Html.Kendo().Grid<PeopleSearchResultDO>()
            .Name("AssociateResultsGrid")
            .AutoBind(false)
            .HtmlAttributes(new { style = "display:none;" })
            .Columns(columns =>
            { 
                columns.Select().Width(50);
                columns.Bound(p => p.PersonId).Hidden(true);
                columns.Bound(p => p.FirstName).ClientTemplate("<strong>#: FirstName #</strong>");
                columns.Bound(p => p.MiddleName).ClientTemplate("<strong>#: MiddleName #</strong>");
                columns.Bound(p => p.LastName).ClientTemplate("<strong>#: LastName #</strong>");   
            })
            .DataSource(dataSource => dataSource
                    .Ajax()
                    .ServerOperation(false)
                    .Read(read =>
                    read.Action("AssociatesSearchResults", "Person")
                    .Data("getPeopleSearchCriteria").Type(HttpVerbs.Post)
                )
                    ) 
            .NoRecords(n => n.Template("<div class='alert alert-danger'><h3 class='text-danger bold'>No records returned!</h3></div>")) 
            .Scrollable(s => s.Height("400px"))
) 
 
<p> <input type="button" id="btnAddAssociate" value="Add Selected Associate(s)" class="btn btn-default bold" style="display: none;" />
        </p>   
 
<script type="text/javascript">
 
    $("#btnAddAssociate").click(function () {
 
        $("#GridMessage_Associate").css("display", "none"); 
        var entityGrid = $("#AssociateResultsGrid").data("kendoGrid");
        var rows = entityGrid.select();  
       
        if (rows !== undefined) { 
            rows.each(function (index, row) {
 
                var selectedItem = entityGrid.dataItem(row);
                // selectedItem has EntityVersionId and the rest of your model
 
                var assogrid = $("#AssociateGrid").data("KendoGrid");
                assogrid.dataSource.add(
                    {
                        PersonId: selectedItem.PersonId,
                        FirstName: selectedItem.FirstName,
                        MiddleName: selectedItem.MiddleName,
                        LastName: selectedItem.LastName,
                        DOB: selectedItem.DOB,
                        Age: selectedItem.Age,
                        LastFourOfSSN: selectedItem.LastFourOfSSN,
                        AddressLine1: selectedItem.AddressLine1,
                        CityOther: selectedItem.CityOther,
                        GenderShortName: selectedItem.GenderShortName,
                        RaceShortName: selectedItem.RaceShortName
                    });
 
                $("#AssociateGrid").css("display", "block");   
                //clear selected items in parent grid 

 //finally close modal window
        var myWindow = $("#associatewindow");
        myWindow.data("kendoWindow").close(); 
            });
        }
        else {               
            $("#AssociateGrid").css("display", "none");
        }  
    })   
</script>

 

[John]

I fixed this. There were typos and case-sensitivity issues. Example:

var assogridDS = $("#AssociateGrid").data("KendoGrid"); 

Should be var assogridDS = $("#AssociateGrid").data("kendoGrid");

"kendoGrid" is case sensitive. There were also other typos which have been fixed.

Thanks.