CODEWITHSUNDEEP
javascriptjquerykendo-uikendo-window
user3304614
user3304614

Reputation: 169

Opening specific KendoUI window by click on a button

I used a KendoUI window component in my page and it shows two windows : window:

  <div id="window1">
        <div style="text-align: center;">
            <img src="../../content/web/window/egg-chair.png" alt="ARNE JACOBSEN EGG CHAIR" />
            <p>
                THIS IS WINDOW1<br />
                Image by: <a href="http://www.conranshop.co.uk/" title="http://www.conranshop.co.uk/">http://www.conranshop.co.uk/</a>
            </p>
        </div>
    </div>

and window 2 :

<div id="window2">
        <div style="text-align: center;">
            <img src="../../content/web/window/egg-chair.png" alt="ARNE JACOBSEN EGG CHAIR" />
            <p>
               THIS IS MY WINDOW2<br />
                Image by: <a href="http://www.conranshop.co.uk/" title="http://www.conranshop.co.uk/">http://www.conranshop.co.uk/</a>
            </p>
        </div>
    </div>

and i have a span like blow:

 <span id="go" class="k-group">Close the window1 and open the window2</span>

by default when my page was loaded both of the windows (i mean window1 and window2) comes up, but i want as the page was loaded window1 comes up and when i click on my span it close window1 and open window2, so write this function :

      $("#go").bind("click", function () {
                      $("#window2").data("kendoWindow").open();

                      $("#window1").data("kendoWindow").close();

                  });

but it does'nt work! what is the problem?

EDIT: and i have :

 function initWindow1() {
                var windowOptions = {
                    width: "500px",
                    title: "EGG CHAIR",
                    visible: false,
                    close: close1   
                };

                $("#window1").kendoWindow(windowOptions);
                $("#window1").data("kendoWindow").center().open();
            }

            initWindow1();

            function initWindow2() {
                var windowOptions = {
                    width: "500px",
                    title: "EGG CHAIR",
                    visible: false,

                };

                $("#window2").kendoWindow(windowOptions);
                $("#window2").data("kendoWindow").open();
            }
            initWindow2();

Upvotes: 0

Views: 5685

Answers (3)

Shazhad Ilyas
Shazhad Ilyas

Reputation: 1193

I think its Span onclick not bindclick

$("#go").on("click", function () {

   $("#window1").data("kendoWindow").close();                                    
   $("#window2").data("kendoWindow").open();
     });

Shaz

Upvotes: 1

Stargazer
Stargazer

Reputation: 472

Is this the only code you have? If so, did you check Javascript errors? It seems that you are subscribing to the close event on Window1 but not actually providing the handling function to it. My bet is on that, providing this is the only code you have. If not, maybe you could give us some more details?

Upvotes: 1

knikolov
knikolov

Reputation: 1800

It seems to be working in this example: http://jsbin.com/cohuxusu/1/edit

Upvotes: 2

Related Questions