return true for click event and continue

Question

Hi I have a popup window control what I'm trying todo is get it to continue the click event if the user chooses the yes button. How do you continue the click event for the 'yes' button, I'm trying to make it return true but it doesn't continue for the click it just return false.

<script type="text/javascript"> 
    $(document).ready(function() {

        $('.delete-question').click(function(e) {                   
            ret = false;    
            _this = this;

            $('#pop-up-1').popUpWindow({
                modal: true,
                blurClass: '.main-container',
                action: "open",
                buttons: [{
                    text: "Yes",
                    click: function () {

                        this.close();
                        ret = true;
                    }
                }, {
                    text: "No",
                    click: function () {
                        this.close();                                   
                    }
                }]
            }); 

            return ret;
        })  
    });
</script>

Answer 1

You can't do it directly, but you can emit the click event once it is needed, e.g. something like this (not tested):

<script type="text/javascript"> 
    // global flag to track the popup state
    var popupReturn = false;

    $(document).ready(function() {

        $('.delete-question').click(function(e) {
            // when true (after Yes click only) go on returning true
            if (popupReturn) {
                popupReturn = false;
                return true;
            }
            else {
              _this = this;

              $('#pop-up-1').popUpWindow({
                  modal: true,
                  blurClass: '.main-container',
                  action: "open",
                  buttons: [{
                      text: "Yes",
                      click: function () {
                          // set global flag to true
                          popupReturn = true;
                          // emit click event where it knows that popupReturn is true
                          $(_this).click();
                          this.close();
                      }
                  }, {
                      text: "No",
                      click: function () {
                          this.close();                                   
                      }
                  }]
                });
                return false;
            }
        })  
    });
</script>

Answer 2

You can't return from asynchronous event like in your case, because your "modal" is not really modal in sense that it doesn't pause code execution until use clicks a button.

This is where callback come handy. I would wrap the modal code into helper plugin and use it like this:

$.fn.confirmable = function(options) {

    options = $.extend({
        close: $.noop,
        dismiss: $.noop
    }, options);

    this.each(function() {
        $(this).popUpWindow({
            modal: true,
            blurClass: '.main-container',
            action: "open",
            buttons: [{
                text: "Yes",
                click: function() {
                    this.close();
                    options.close();
                }
            }, {
                text: "No",
                click: function() {
                    this.close();
                    options.dismiss();
                }
            }]
        });
    });
};


$('.delete-question').confirmable({
    close: function() {
        // ok pressed do something
    },
    dismiss: function() {
        // cancel pressed
    }
});

It means that your workflow needs to transform to asynchronous callback/promise-based.