You can use Jquery for the same, and show summary in Modal Popup.

You can do something like below.

I have used bootstrap modal to show summary.

<div id="form-summary-modal" class="modal fade" role="dialog">
        <div class="modal-dialog">
            <div class="modal-content"> 
                <div class="modal-body"> 
                </div>
                <div class="modal-footer">
                    <button id="btnSubmit" type="button" class="btn btn-success">Submit</button>
                    <button id="btnCancel" type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                </div>
            </div>

        </div>
    </div>

Using jquery form submit method.

$("form").on("submit", function (e) {
            e.preventDefault();// This will prevent form submit

            var form = this;
            var formData = $(this).serializeArray();

            var html = GetFormDataInTable(formData)


            $("#form-summary-modal").modal("show");// Bootstrap Model
            $(".modal-body").html(html);

            // Unbind Existing Click event
            $("#btnSubmit").unbind("click");


            $("#btnSubmit").click(function () {
                //Submit Form

                $.post($(form).attr("action"), $(form).serializeArray(), function (response) {
                    //process response here
                    $("#myModal").modal("hide");
                    $(form).find("[type='submit']").removeAttr("disabled");

                    alert(response);
                })
            })
            $("#btnCancel").click(function () {
                //Cancel Form Submit
                $("#myModal").modal("hide");
                $(form).find("[type='submit']").removeAttr("disabled");
            })
            return false;

        })

        function GetFormDataInTable(formData) {
            // Create Table Element To Show Summary
            var html = document.createElement("table"); 
            html.setAttribute("class", "table");

            //loop form field array
            $.each(formData, function (i, v) {
                if ($("[name=" + v.name + "]").is(":visible")) {
                    //append Each Form Field Data to table (only visible form fields)
                    $(html).append(GetFieldData(v));
                }
            })
            return html;
        }

        function GetFieldData(field) {

            var name = $("[name=" + field.name + "]").parent("div").siblings("label").text();
            var value = field.value;
            var tr = $("<tr><td>" + name + "</td><td>" + value + "</td></tr>");

            return tr;

        }

Note: I have considered default Umbraco Form Theme, to get Form Field Name.