How can we collect a value from the user in the modal window, and return it to the main page?

Easy: since we have access to any javascript functions available (after all, we're living in the same HTML page), we can call any helper just before closing the modal.

function close_popup(modal) {
    var value = modal.find('.my-modal-body input').val();
    save_text_value(value);
    modal.hide();
}

function save_text_value(value) {
    if (value) {
        $('#result-wrapper').show();
        $('#result').text(value);
    }
    else {
        $('#result-wrapper').hide();
    }
}

Always remember to clean the input box every time before showing the modal box, as this will be reused again and again:

function open_popup(modal) {
    var input = modal.find('.my-modal-body input');
    input.val('');
    modal.show();
    input.focus();
}

Code sample

Open Modal

You entered: