This is a migrated thread and some comments may be shown as answers.

Dynamic callback to a modalview

5 Answers 97 Views
ModalView
This is a migrated thread and some comments may be shown as answers.
N Mackay
Top achievements
Rank 1
N Mackay asked on 16 Dec 2013, 01:39 PM
In WPF RadControls you can pass a function call back to a RadWindow. Can you use a similar approach with Kendo modalView?

WPF Example

this.commandWindowClosing = new RelayCommand<CancelEventArgs>((args) =>
            {
                if (!_closing)
                {
                    args.Cancel = true;
                    RadWindow.Confirm(AppConstConfirmShutdown, this.RequestShutdown);
                }
            });
 
private void RequestShutdown(object sender, WindowClosedEventArgs e)
        {
            try
            {
 
                if (e.DialogResult == true)
                {
                            // Do something
                }
Sorry for posting C# :-)

Is this approach possible with Javascipt and modalView in am mobile app? the samples I've seen don't do this

I know you can override the close event but that doesn't help me, If Kendo implemented Confirm,Alert etc like RadWindow it would be very useful.

5 Answers, 1 is accepted

Sort by
0
Kiril Nikolov
Telerik team
answered on 16 Dec 2013, 01:58 PM
Hello Norman,

The functionality that you are looking for is not supported.

You can use the Kendo UI Mobile ModalWindow's events - open, close, init and perform the custom functionality that you need there.

Please do not hesitate to contact us if any further help is needed.

Regards,
Kiril Nikolov
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
N Mackay
Top achievements
Rank 1
answered on 16 Dec 2013, 02:08 PM
Hi Kiril,

Thanks for such a quick response.

I had a look at the close event and overriding it but I can't see how I could get a return value from the modalView with a yes/no buttons and implement it in a reusable way like a simple MessageBox in .NET or RadWindow.Confirm.

Maybe I'm missing something

Kind Regards,
Norman.
0
Accepted
Kiril Nikolov
Telerik team
answered on 16 Dec 2013, 02:26 PM
Hi Norman,

This behavior is not built-in the ModalView as it was not created to server this type of functionality. However it is pretty easy to implement something like this, using regular buttons placed inside the ModalView. Please check the following example, and let me know if it helps:

http://jsbin.com/IKOLIwE/1/edit

Regards,
Kiril Nikolov
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
N Mackay
Top achievements
Rank 1
answered on 16 Dec 2013, 02:42 PM
Hi Kiril,

Thanks for your sample. I've implemented something similar already and it works fine but it's not reusable so as far as I can see if you had 6 different views that needed a yes/no confirm they'd have to be a separate implementation for each one unless you wrapped it into a helper class that could be called.

Ended up doing this as far as I can see each conform dialog needs it;s own implementation (luckily I only have one.

Markup
<div data-role="modalview" id="modalviewAppClose" style="width: 70%; height: 25%;">
            <div data-role="header">
                <div id="notifyNavbar" data-role="navbar">
                    <span>
                        <label id="notifyTitle">Exit</label>
                    </span>
                </div>
            </div>
            <div>
                <span>
                    <label id="shutdownMessage" style="vertical-align:middle;">Are you sure you wish to exit the app?</label>
                </span>
            </div>
            <footer data-role="footer">
                <span>
                    <center>
                        <a data-click="appShutdown" type="button" data-role="button">Confirm</a>
                        <a data-click="appShutdownCancel" type="button" data-role="button">Cancel</a>
                    </center>
                </span>
            </footer>
        </div>
Code
// Support for back button on Android devices
           function onLoad() {
               document.addEventListener("deviceready", onDeviceReady, false);
           }
            
           function onDeviceReady() {
               // Register the event listener
               document.addEventListener("backbutton", onBackKeyDown, false);
           }
            
           function onBackKeyDown() {
               
               if (kendo.support.mobileOS.android) {
                   app.hideLoading();
                   $("#modalviewAppClose").data("kendoMobileModalView").open();
               }
           }
            
           // Handles confirm click on shutdown modal view
           function appShutdown() {
               $("#modalviewAppClose").kendoMobileModalView("close");
               navigator.app.exitApp()
           }
            
           // Handles confirm click on shutdown modal view
           function appShutdowCancel() {
               $("#modalviewAppClose").kendoMobileModalView("close");
           }
Thanks for you assistance,
Norman.

0
Kiril Nikolov
Telerik team
answered on 16 Dec 2013, 02:45 PM
Hello Norman,

I am glad you found a solution that fits your app requirements. 

Please keep in mind that we always have our User Voice section opened, so if you have any suggestions, please do not hesitate to share.

Regards,
Kiril Nikolov
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
ModalView
Asked by
N Mackay
Top achievements
Rank 1
Answers by
Kiril Nikolov
Telerik team
N Mackay
Top achievements
Rank 1
Share this question
or