jQuery UI Widgets › Forums › Dialogs and Notifications › Window › Accessing button's bind function multiple times after closing window

Tagged: , , , ,

This topic contains 1 reply, has 2 voices, and was last updated by  Dimitar 11 years, 11 months ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Accessing button's bind function multiple times after closing window Posts
  • September 24, 2012 at 2:34 pm Accessing button's bind function multiple times after closing window #8381

    jmarais
    Participant

    I have a situation that I came across many times. On occasions when I use a modal window which contains one or more buttons, where these buttons each have a binding function and should I close the window, opens it again, and clicking on a button, it enters the button’s binding function more than once.

    For example:
    If I open the window once and click on the button, it enters the binding function once.

    Should I close the window and opens it again and click on the button, then it enters the binding function twice.

    Should I open and close the window, say 6 times, then it enters the binding function 6 times.

    Should I do something else when I close a window before opening it again?

    September 25, 2012 at 5:22 am Accessing button's bind function multiple times after closing window #8397

    Dimitar
    Participant

    Hello jmarais,

    Here is an example that uses has three buttons bound to the ‘click’ event. It works fine and we do not encounter any issues. Please test it and share your feedback. You may also send us a code snippet from your project if the issue persists.

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>jQuery Window CSS Styling Sample</title>
        <link rel="stylesheet" href="../../jqwidgets2.4.2/jqwidgets/styles/jqx.base.css"
            type="text/css" />
        <link rel="stylesheet" href="../../jqwidgets2.4.2/jqwidgets/styles/jqx.summer.css"
            type="text/css" />
        <script type="text/javascript" src="../../scripts/jquery-1.8.1.min.js"></script>
        <script type="text/javascript" src="../../jqwidgets2.4.2/jqwidgets/jqxcore.js"></script>
        <script type="text/javascript" src="../../jqwidgets2.4.2/jqwidgets/jqxwindow.js"></script>
        <script type="text/javascript">
            $(document).ready(function () {
                $("#jqxwindow").jqxWindow({ height: 90, width: 150, theme: 'summer', isModal: true, closeButtonAction: 'hide' });
                $("#OK").click(function () {
                    $("body").append(" You clicked OK!");
                });
                $("#Close").bind('click', function () {
                    $("#jqxwindow").jqxWindow('close');
                    $("body").append(" closed");
                });
                $("#Open").click(function () {
                    $("#jqxwindow").jqxWindow('open');
                    $("body").append(" opened");
                });
            });
        </script>
    </head>
    <body>
        <div id='content'>
            <button id="Open">
                Open window</button>
            <div id='jqxwindow'>
                <div>
                    Header</div>
                <div>
                    Content<br />
                    <button id="OK">
                        OK</button>
                    <button id="Close">
                        Close</button>
                </div>
            </div>
        </div>
    </body>
    </html>

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

  • Author
    Posts
Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.