# MVC: Replace the Ribbon Table Menu with a Quick Insert Table Drop-down > Replace the default Web.TextControl ribbon table button with a grid-based quick insert dropdown using JavaScript. The tutorial renders a visual row-and-column picker, sends the selected dimensions to an MVC controller, creates the table via ServerTextControl, and inserts it. - **Author:** Bjoern Meyer - **Published:** 2015-12-23 - **Modified:** 2026-07-17 - **Description:** Replace the default Web.TextControl ribbon table button with a grid-based quick insert dropdown using JavaScript. The tutorial renders a visual row-and-column picker, sends the selected dimensions to an MVC controller, creates the table via ServerTextControl, and inserts it. - **2 min read** (241 words) - **Tags:** - ASP.NET - GitHub - HTML5 - MVC - **Web URL:** https://www.textcontrol.com/blog/2015/12/23/mvc-replace-the-ribbon-table-menu-with-a-quick-insert-table-drop-down/ - **LLMs URL:** https://www.textcontrol.com/blog/2015/12/23/mvc-replace-the-ribbon-table-menu-with-a-quick-insert-table-drop-down/llms.txt - **LLMs-Full URL:** https://www.textcontrol.com/blog/2015/12/23/mvc-replace-the-ribbon-table-menu-with-a-quick-insert-table-drop-down/llms-full.txt - **GitHub Repository:** https://github.com/TextControl/TextControl.Web.MVC.TableWizard --- MS Word provides a quick insert table drop-down to insert tables into the document. This sample shows how to replace the insert table button with such a table insert drop-down. ![MVC: Replace the ribbon table menu with a quick insert table drop-down](https://s1-www.textcontrol.com/assets/dist/blog/2015/12/23/a/assets/ani_tables.webp "MVC: Replace the ribbon table menu with a quick insert table drop-down")The replacement and the new drop down button is done using Javascript and can be found in the [GitHub repository](https://github.com/TextControl/TextControl.Web.MVC.TableWizard). In order to insert the specific table, a controller method is called using Javascript: ``` function getTableFromController(cols, rows) { var serviceURL = "/Home/GetTableFromController"; $.ajax({ type: "POST", url: serviceURL, contentType: 'application/json', data: JSON.stringify({ Columns: cols, Rows: rows }), success: successFunc, error: errorFunc }); function successFunc(data, status) { TXTextControl.loadSelection(TXTextControl.streamType.InternalUnicodeFormat, data); } function errorFunc() { alert('Error'); } } ``` The controller method creates a new *ServerTextControl* instance to insert the specified table. The document is returned to the client and inserted at the current input position using the Javascript method [loadSelection](https://docs.textcontrol.com/textcontrol/asp-dotnet/ref.javascript.txtextcontrol.loadselection.method.htm). ``` [HttpPost] public string GetTableFromController(Table model) { byte[] data; using (TXTextControl.ServerTextControl tx = new TXTextControl.ServerTextControl()) { tx.Create(); tx.Tables.Add(model.Rows, model.Columns); 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: Loading Files from the Backstage Menu](https://www.textcontrol.com/blog/2016/01/06/mvc-loading-files-from-the-backstage-menu/llms.txt) - [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: 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)