Create dialog windows using popup widget

Create dialog windows using popup widget

I am creating dialog windows in many projects using the popup widget. The problem is that I need to define a lot of code that I think is not necessary.

1. I define configuration and open the popup when an button is clicked
2. In the popup configuration I define click events for the buttons
3. For each button I have to define code to remove click events for all buttons in the window
4. Each button also has code to close the popup

Is this a normal way of creating dialogues on jQuery Mobile?


HTML:
  1.                 <!-- button to open popup -->
                    <button id="button-popup-open">Open popup</button>
                   
                    <!-- the popup -->
                    <div data-role="popup" id="popup">
                        <h2>Heading</h2>
                        <p>Text text text</p>
                        <button id="button-yes">Yes</button>
                        <button id="button-no">No</button>
                    </div>

Javascript:
  1.                     $(document).on("pageinit", function() {

                            $("#button-popup-open").on("click", function() {

                                // configures the popup
                                $("#popup").popup({
                                    afteropen: function() {
                                        //console.log("test");
                                        $("#button-yes").on("click", function() {
                                            console.log("yes clicked");
                                            $("#button-yes").off("click"); 
                                            $("#button-no").off("click");  
                                            $("#popup").popup("close");
                                        });
                                        $("#button-no").on("click", function() {
                                            console.log("no clicked");
                                            $("#button-yes").off("click");
                                            $("#button-no").off("click");
                                            $("#popup").popup("close");
                                        });
                                    }
                                });

                                // opens the popup
                                $("#popup").popup("open");

                                return false;
                            });

                        });