Source/Umbraco/Views/FormEditorSync.cshtml

﻿@inherits Umbraco.Web.Mvc.UmbracoTemplatePage
@{
  Layout = null;
  
  @* if the content being rendered does not contain the form property, pass the applicable content like this *@
  // ViewBag.FormContent = myInstanceOfIPublishedContent;

  @* if your form property is not called "form" on the content type, pass the property name like this *@
  // ViewBag.FormName = "myForm";

  @* if you want to load submission data for an existing form submission, specify the row ID (GUID) like this *@
  // ViewBag.FormRowId = "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx";

  @* if you're using form pages and want to render your own paging links, use this *@
  // ViewBag.FormSkipPagingLinks = true;
}
<!DOCTYPE html>
<html>
<head>
  <title>@Model.Content.Name</title>
  <link rel="stylesheet" href="http://getbootstrap.com/dist/css/bootstrap.min.css"/>
  @* add some styles for Form Editor *@
  <style>
    /* required field indicator on the field labels */
    div.form-group.required > label:after {
      content: ' *';
      color: #a94442;
    }

    /* pagination arrows */
    ul.pager li.previous a:before, ul.pager li.next a:after {
      content: "\e080";
      position: relative;
      top: 1px;
      display: inline-block;
      font-family: 'Glyphicons Halflings';
      font-style: normal;
      font-weight: 400;
      line-height: 1;
      -webkit-font-smoothing: antialiased;
    }
    ul.pager li.previous a:before {
      content: "\e079";
    }
  </style>
</head>
<body>
  
  @* step 1: render the form with the Sync partial *@
  @Html.Partial("FormEditor/Sync", Umbraco.AssignedContentItem)

  @* step 2: include jQuery *@
  <script src="https://code.jquery.com/jquery-2.1.4.min.js" type="text/javascript"></script>

  @* step 3: include Form Editor script for synchronous postback (using jQuery) *@
  <script src="/JS/FormEditor/FormEditorSync.js" type="text/javascript"></script>

</body>
</html>