如何將表單數據發送到遠程URL並以Bootstrap模式顯示結果？

Question

我有一個CakePHP表單，我想允許用戶顯示預覽。 因此，有一個預覽提交按鈕#btn_submit_preview ，當用戶單擊該按鈕時，表單中的數據將被序列化並發送到我的控制器。 該控制器保存數據並返回帶有預覽的HTML視圖輸出：

 $('#btn_submit_preview').click(function (event) {
    var formData = $("#OfferAddForm").serialize();
    $.ajax({
        type: "POST",
        url: "/offers/preview/",
        data: formData,
        success: function (data) {
            $('#content').html(data);
            $('#myModal').modal('show');
        }
    });
    event.preventDefault();
    return false;
});

將數據傳遞回頁面后，我需要在Boostrap模態窗口中顯示它們。 我有這些HTML模態源代碼。

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content" id="content">
        </div>
    </div>
</div>

問題：打開“預覽”的方式是否正確？還是應該做其他事情？ 我很確定要將返回的數據分配回模式窗口- $('#content').html(data); 也許我應該返回帶有預覽數據的模態窗口的所有HTML源，並僅將其打開...？

Answer 1

我認為您現在擁有的一切都很好。 我不會返回整個模式的HTML源代碼，而只是獲取電子郵件的HTML並將其顯示在我的模式上，這有助於實現IMO更好的關注點分離。