title: .NET / jquery - previewing a form result/rendering a view to a string
body: <p>Here's the situation (using MVC 2.0): </p>
  
  <p>I'm trying to build a feature to allow a user to preview changes they make to their bio/profile without actually committing their changes first. User fills out a form, clicks a "Preview" button and see what their changes look like. One difficulty is the front-end has a different master-page, so we need to render the whole view, not just a control.</p>
  
  <p>Here's the approach I took:</p>
  
  <ol>
  <li>Asynch post the serialized form to a controller action</li>
  <li>Manipulate the model to flesh out the collections, etc. that don't get posted</li>
  <li>Return the front-end view, passing it this modified model</li>
  <li>Catch the response to the asynch method, wrap it in an iframe and write that to a lightboxed div on the page</li>
  </ol>
  
  <p>Code I'm using... Controller action (the BuildPreview method just alters the model slightly)</p>
  
  <pre><code>    [HttpPost]
      [Authorize]
      public ActionResult PreviewProfile(PersonModel model)
      {
          return View("Person", PeopleService.BuildPreview(model));;
      }
  </code></pre>
  
  <p>HTML/Jquery stuff:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  $(document).ready(function () {
  
      $("#previewButton").click(function (e) {
          $.post("/PreviewProfile", $("#bioForm").serialize(), function (response) {
              $("#previewFrame").html(response);
              $("#holdMyPreview").modal({
                                  overlayClose: true,
                                  escClose: true,
                                  autoResize: true,
                              }, "html");
          });
      });
  });
  </code></pre>
  
  <p>
          </p>
  
  <p>The modal method is just a basic lightbox-esque thing.</p>
  
  <p>Running into two problems:</p>
  
  <ol>
  <li>EDIT - removed this, I was accidentally pulling a child control</li>
  <li>The iframe isn't rendering the html (perhaps because it's not valid b/c it's missing html/body/head tags?). If I just drop the response direcltly into the div, without the iframe, it works... albiet with the wrong stylesheet. If I try to insert it into iframe it just treats it as an empty page, just the html, head and body tags show up.</li>
  </ol>
  
  <p>Any thoughts?</p>
  
  <p>Sam</p>
  
  <p>PS: Tried this over at MSDN forums (http://forums.asp.net/t/1675995.aspx/1?Rendering+a+view+into+a+string+) and it didn't get anywhere, figured I'd see if SO has any brilliance.</p>