Question

I’ve following function for getting HTML template from server and replacing some tags

$.ajax({
    url: "/newsletter/preview/1",
    data: {},
    success: function(data) {
        var template = data;
        var layer = $("<iframe>").attr({ "id": "preview_frame" });
        $("#newsletter .element input, #newsletter .element textarea").each(function() {
            var id = "\\$\\$"+$(this).parent().parent().attr("id").replace(/^newsletter_/, "")+"\\$\\$";
            template = template.replace(new RegExp(id, "g"), htmlspecialchars($(this).val(),2));
        });
        $("body").prepend(layer);
    },
    dataType: "html"
});

Getting the template works fine. Also replacing the tags with content of form (when placing alert(escape(template)); inside each loop shows me, that all tags are being replaced). But there are two unsolved problems yet:

• I didn’t find a way to set content of variable template into iframe
  ($("#preview_frame").contents().find("body").html(template);
  results only in an empty frame)

• Prepending the iframe (variable layer) to the HTML body happens
  during iterating through form fields, but it has to be done after(!)
  all tags have been replaced, so that only the complete processed template is going to be placed inside the iframe.

Answer 1

I’m using now form plugin for jQuery from http://malsup.com/jquery/form/.
So I’m sending form via Ajax to server, which generates temporary file that is included via iframe after successful sending form.