How to open a window with different controller

[Bill]

Hi,

I am trying to convert existing code that uses ngModal (similar to bootstrap modal) to a kendo window control.  This is within an Angular 1.4 SPA, 2016 Q1 Kendo Pro.  The issue I'm having is that I can't figure out how to set the controller for the modal and be able to open it from a function in a different controller.  I run into problems where either I can find and open the window but the controller is the calling controller, or I cannot find the window by id at all.

The original code in gridController looks something like this:

        function openModal() {
            $scope.myModal = ngDialog.open({
                template: 'scripts/sections/contract/views/partials/myModal.html',
                scope: $scope,
                controller: 'modalController',
                backdrop: 'static',
                closeByDocument: false,
                preCloseCallback: function (value) {
                    $("#myGrid").data("kendoGrid").dataSource.read();
                }
            });

The kendo window widget does not have controller or scope properties, so a simple replacement won't work.  My next attempt was to wrap the myModal.html with the following, <div  data-ng-controller="modalController as vm">     <div kendo-window="kwindow" k-options="windowOptions">.  The modalController has $scope.windowOptions ={...} with appropriate values.  When I do this: var kwin = $("#kwindow").data("kendoWindow");  from the gridController, kwindow is always empty.  Alternatively, I can put the window in html that lives under the GridController and then find it, but that will never work for segregating the controllers and I want to keep them separated.  So how can this be done?

[Bill]

I think I have it figured out but you'll need to nest the controllers.  I don't know how the window could be visible to the dom any other way.  If anyone finds a way to do this without nesting divs/controllers, let me know.

 

Here is a nice demo showing how to do it.

http://dojo.telerik.com/uNaba/4

 

[Bill]

Didn't see it before but win5, the last example, is not binding with scope and leaving {{hello}} in the content. It should be "Wassup from Controller 2" as shown in win4.

[Dimo]

Hi Bill,

Window 5 does not display the value of the hello scope variable, because the widget is created via JavaScript, so it is not Angular aware. As a result, when its Ajax content is rendered, there is nobody to digest the Window content automatically. You either need to do this manually, or create Window 5 the Angular way, as Window 4.

We have some documentation related to scopes, controllers and Kendo UI Windows here:

http://docs.telerik.com/kendo-ui/AngularJS/introduction#widgets-placed-in-window

Regards,
Dimo
Telerik