JSFiddle - React, Tailwind, and code Playground

by refhat

HTML

<script src="http://www.ericmmartin.com/wordpress/wp-content/plugins/simplemodal-login/js/jquery.simplemodal.js?ver=1.4.1"></script>
<link rel="stylesheet" href="http://www.ericmmartin.com/wordpress/wp-content/plugins/simplemodal-login/css/osx.css?ver=1.0.4">
<form action="testmodalpost.php" id="testmodal" method="post">
<input type="text" name="inp1" id="inp1"/>
<input type="text" name="inp2" id="inp2"/>
<input type="submit" name="sbmt1" id="sbmt1" value="send"/>
</form>

JavaScript

jQuery(function ($) {
    $("form").bind("submit", function(e) {
        var form_id = $(this).attr('id');
        e.preventDefault();
        confirm("Continue to the SimpleModal Project page?", function () {
            $("#"+form_id).trigger("submit");
            return true;
        });
    });
});

function confirm(message, callback) {
    $('#confirm').modal({
        closeHTML: "<a href='#' title='Close' class='modal-close'>x</a>",
        position: ["20%",],
        overlayId: 'confirm-overlay',
        containerId: 'confirm-container', 
        onShow: function (dialog) {
            var modal = this;

            $('.message', dialog.data[0]).append(message);

            $('.yes', dialog.data[0]).click(function () {
                if ($.isFunction(callback)) {
                    callback.apply();
                }
                modal.close(); // or $.modal.close();
            });
        }
    });
}