# MVC: Loading Files from the Backstage Menu

> An MVC partial backstage view lists available files from a directory using a simple document model. When a user clicks a file, JavaScript sends an AJAX request to an HttpPost controller method that loads the document server-side via ServerTextControl and returns it to the editor.

- **Author:** Bjoern Meyer
- **Published:** 2016-01-06
- **Modified:** 2026-03-05
- **Description:** An MVC partial backstage view lists available files from a directory using a simple document model. When a user clicks a file, JavaScript sends an AJAX request to an HttpPost controller method that loads the document server-side via ServerTextControl and returns it to the editor.
- **3 min read** (426 words)
- **Tags:**
  - ASP.NET
  - GitHub
  - HTML5
  - MVC
- **Web URL:** https://www.textcontrol.com/blog/2016/01/06/mvc-loading-files-from-the-backstage-menu/
- **LLMs URL:** https://www.textcontrol.com/blog/2016/01/06/mvc-loading-files-from-the-backstage-menu/llms.txt
- **LLMs-Full URL:** https://www.textcontrol.com/blog/2016/01/06/mvc-loading-files-from-the-backstage-menu/llms-full.txt
- **GitHub Repository:** https://github.com/TextControl/TextControl.Web.MVC.BackstageView.Open

---

Happy New Year, everybody!

In the [last blog entry](https://www.textcontrol.com/blog/2015/12/30/mvc-replace-the-file-menu-with-a-backstage-view-menu/llms-full.txt), we showed how to replace the file menu with an MS Word-style backstage menu. This project shows how to load documents from a partial view in the backstage menu.

![MVC: Loading files from the backstage menu](https://s1-www.textcontrol.com/assets/dist/blog/2016/01/06/a/assets/tx_animation_backstage_open.webp "MVC: Loading files from the backstage menu")

The partial backstage view *Open.cshtml* uses a very simple model to describe a document:

```
public class Document
{
    public Document() { }

    public Document(string FilePath)
    {
        this.FilePath = FilePath;
        this.Name = Path.GetFileName(this.FilePath);
    }

    public string Name { get; }
    public string FilePath { get; set; }
}
```

In the partial view, a list item is created for each file of the given model:

```
<ul>
 @foreach (var item in Model) {
  <li>
   <a onclick="LoadFromController('@item.Name')" class="right" href="#">
    <img src="~/img/doc.png" /><strong>@item.Name</strong>
    <p>...

     @{
      if (Path.GetDirectoryName(item.FilePath).Length > 50)
      {
       @Path.GetDirectoryName(item.FilePath).Substring(
        Path.GetDirectoryName(item.FilePath).Length - 50);
      }
      else
      {
       @Path.GetDirectoryName(item.FilePath);
      }
     }

    </p>
   </a>
  </li>
 }
</ul>
```

The controller *ActionResult**GetView* iterates through all files of a given directory in order to create the view model that is used in the above partial view:

```
public ActionResult GetView(string viewName)
{
    switch (viewName)
    {
        case "Open":
            var documents = new List<Document>();

            foreach (string file in Directory.GetFiles(
              Server.MapPath("/App_Data/documents")))
            {
                Document doc = new Document(file);
                documents.Add(doc);
            }

            return PartialView("Stageviews/Open", documents);
    }

    return PartialView("Stageviews/" + viewName);
}
```

If a file is clicked in the view, the following Javascript loads a document from the controller *HttpPost* method *LoadTemplate*:

```
function LoadFromController(DocumentName) {
    var serviceURL = "/Home/LoadTemplate";

    $.ajax({
        type: "POST",
        url: serviceURL,
        contentType: 'application/json',
        data: JSON.stringify({
            DocumentName: DocumentName
        }),
        success: successFunc,
        error: errorFunc
    });

    function successFunc(data, status) {
        TXTextControl.loadDocument(
          TXTextControl.streamType.InternalUnicodeFormat, data);
        animateBackstage(1);
    }

    function errorFunc() {
        alert('File could not be loaded');
    }
}
```

The controller method *LoadTemplate* loads the selected file into a temporary [ServerTextControl](https://docs.textcontrol.com/textcontrol/windows-forms/ref.txtextcontrol.servertextcontrol.class.htm) and returns the document in the internal TX Text Control format which is loaded client-side using Javascript into TX Text Control.

```
[HttpPost]
public string LoadTemplate(LoadDocumentViewModel model)
{
    byte[] data;

    using (TXTextControl.ServerTextControl tx =
      new TXTextControl.ServerTextControl())
    {
        tx.Create();

        TXTextControl.StreamType streamType =
          TXTextControl.StreamType.WordprocessingML;

        switch(Path.GetExtension(model.DocumentName))
        {
            case ".doc":
                streamType = TXTextControl.StreamType.MSWord;
                break;
            case ".rtf":
                streamType = TXTextControl.StreamType.RichTextFormat;
                break;
            case ".tx":
                streamType = TXTextControl.StreamType.InternalUnicodeFormat;
                break;
            case ".pdf":
                streamType = TXTextControl.StreamType.AdobePDF;
                break;
        }

        tx.Load(Server.MapPath("/App_Data/documents/" +
          model.DocumentName), streamType);

        tx.Save(out data,
          TXTextControl.BinaryStreamType.InternalUnicodeFormat);
    }

    return Convert.ToBase64String(data);
}
```

Download the sample from GitHub and test it on your own.

---

## About Bjoern Meyer

As CEO, Bjoern is the visionary behind our strategic direction and business development, bridging the gap between our customers and engineering teams. His deep passion for coding and web technologies drives the creation of innovative products. If you're at a tech conference, be sure to stop by our booth - you'll most likely meet Bjoern in person. With an advanced graduate degree (Dipl. Inf.) in Computer Science, specializing in AI, from the University of Bremen, Bjoern brings significant expertise to his role. In his spare time, Bjoern enjoys running, paragliding, mountain biking, and playing the piano.

- [LinkedIn](https://www.linkedin.com/in/bjoernmeyer/)
- [X](https://x.com/txbjoern)
- [GitHub](https://github.com/bjoerntx)

---

## Related Posts

- [MVC: Replace the File Menu with a Backstage View Menu](https://www.textcontrol.com/blog/2015/12/30/mvc-replace-the-file-menu-with-a-backstage-view-menu/llms.txt)
- [MVC: Replace the Ribbon Table Menu with a Quick Insert Table Drop-down](https://www.textcontrol.com/blog/2015/12/23/mvc-replace-the-ribbon-table-menu-with-a-quick-insert-table-drop-down/llms.txt)
- [MVC: Arrange a Docked Web.TextControl with a Custom Bar at the Top](https://www.textcontrol.com/blog/2015/12/18/mvc-arrange-a-docked-webtextcontrol-with-a-custom-bar-at-the-top/llms.txt)
- [MVC: Autosave and Restore Documents to and from the Local Browser Storage](https://www.textcontrol.com/blog/2015/12/14/mvc-autosave-and-restore-documents-to-and-from-the-local-browser-storage/llms.txt)
- [MVC: Loading and Saving Documents Through Controller HttpPost Methods](https://www.textcontrol.com/blog/2015/12/08/mvc-loading-and-saving-documents-through-controller-httppost-methods/llms.txt)
- [HTML5: Saving Documents in an MVC Controller Method](https://www.textcontrol.com/blog/2015/10/01/html5-saving-documents-in-an-mvc-controller-method/llms.txt)
- [Web.TextControl: JQueryUI Alert Boxes and Javascript Events](https://www.textcontrol.com/blog/2015/04/20/webtextcontrol-jqueryui-alert-boxes-and-javascript-events/llms.txt)
- [Detect Toggle Button Changes Using a MutationObserver](https://www.textcontrol.com/blog/2021/11/11/detect-toggle-button-changes-using-a-mutationobserver/llms.txt)
- [Implementing Conditional Table Cell Colors with MailMerge](https://www.textcontrol.com/blog/2020/10/08/implementing-conditional-table-cell-colors-with-mailmerge/llms.txt)
- [Deploying the MVC HTML5 Editor to Azure App Services](https://www.textcontrol.com/blog/2018/04/06/deploying-the-mvc-html5-editor-to-azure-app-services/llms.txt)
- [Updated MVC Sample: Loading Files from the Backstage Menu](https://www.textcontrol.com/blog/2017/04/20/updated-mvc-sample-loading-files-from-the-backstage-menu/llms.txt)
- [ASP.NET MVC: Implementing a Simplistic, Custom Button Bar](https://www.textcontrol.com/blog/2017/03/13/aspnet-mvc-implementing-a-simplistic-custom-button-bar/llms.txt)
- [ASP.NET MVC: Adding Protected Sections to Documents](https://www.textcontrol.com/blog/2017/03/01/aspnet-mvc-adding-protected-sections-to-documents/llms.txt)
- [ASP.NET: Adding Electronic Signatures to Documents](https://www.textcontrol.com/blog/2016/10/12/aspnet-adding-electronic-signatures-to-documents/llms.txt)
- [MVC: Loading a Document in the View Code from a MemoryStream](https://www.textcontrol.com/blog/2016/03/16/mvc-loading-a-document-in-the-view-code-from-a-memorystream/llms.txt)
- [HTML5: Adding a Download Button to the Ribbon File Menu](https://www.textcontrol.com/blog/2015/10/22/html5-adding-a-download-button-to-the-ribbon-file-menu/llms.txt)
- [HTML5: Make Merge Field Lists Scrollable in the Ribbon Bar](https://www.textcontrol.com/blog/2015/10/16/html5-make-merge-field-lists-scrollable-in-the-ribbon-bar/llms.txt)
- [HTML5: Store Documents Using the Local Browser Storage](https://www.textcontrol.com/blog/2015/10/09/html5-store-documents-using-the-local-browser-storage/llms.txt)
- [HTML5: Display and Handle FormCheckBox Fields](https://www.textcontrol.com/blog/2015/09/22/html5-display-and-handle-formcheckbox-fields/llms.txt)
- [Building a Touch-enabled Button Bar with Javascript](https://www.textcontrol.com/blog/2015/05/27/building-a-touch-enabled-button-bar-with-javascript/llms.txt)
- [TextControl.Web: Creating an MVC Application with Razor](https://www.textcontrol.com/blog/2015/05/12/textcontrolweb-creating-an-mvc-application-with-razor/llms.txt)
- [TextControl.Web: Adding a Block Navigation Panel](https://www.textcontrol.com/blog/2015/05/08/textcontrolweb-adding-a-block-navigation-panel/llms.txt)
- [Building a TX Text Control Project with GitHub Actions and the Text Control NuGet Feed](https://www.textcontrol.com/blog/2026/02/09/building-a-tx-text-control-project-with-github-actions-and-the-text-control-nuget-feed/llms.txt)
- [Creating an ASP.NET Core Web App with Docker Support and GitHub Packages](https://www.textcontrol.com/blog/2024/01/05/creating-an-asp-net-core-web-app-with-docker-support-and-github-packages/llms.txt)
- [Official TX Text Control .NET Sample Applications Are Now Hosted on GitHub](https://www.textcontrol.com/blog/2023/01/08/official-tx-text-control-net-sample-applications-are-now-hosted-on-github/llms.txt)
