TX Text Control Blog

ASP.NET MVC: Implementing a simplistic, custom button bar

Björn Meyer

Blogged by Björn Meyer on March 13, 2017 and tagged with html5, reporting, github, asp.net.


For some applications, the fully-featured ribbon bar might be too overloaded with features or the ribbon concept is not required in a project. Programmatically, all ribbon tabs, groups and buttons can be removed or modified. But this sample shows how remove the ribbon bar completely and to implement your own, custom button bar with simple toggle buttons.

ASP.NET MVC: Implementing a simplistic, custom button bar

The whole implementation is done using pure HTML, CSS and JavaScript. The following HTML represents the custom ribbon bar:

The following JavaScript code is used to attach a click event to the Bold button. Using a command, the TXTextControl.InputFormatProperty.Bold is set on Text Control.

In order to update the state of the button based on the current input position, the inputFormatReceived event is used. This event is triggered, if the format at the current position has been changed (or the input position has been changed to another position with a different format):

In the event handler itself, the returned id defines the input format property. Using a switch statement, all different cases are handled. If the text at the current input position is formatted with bold, the value paramater is true and the button status is updated accordingly:

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

Download and fork this sample on GitHub

We proudly host our sample code on github.com/textcontrol. Feel free to fork and contribute!

Download ZIP

Open repository on GitHub

Open in Visual Studio

Requirements for this sample

  • at least Visual Studio 2015
  • At least a trial version of TX Text Control .NET Server for ASP.NET
 
 
Call us: +1 704-544-7445 (United States)
 
 

Products

Support

Downloads

Corporate

Buy Now

About Text Control

Founded in 1991, Text Control is an award-winning Visual Studio Industry Partner and leading vendor of word processing and reporting components for Microsoft development technologies. The products help thousands of developers add comprehensive word processing functionality to their applications. Text Control is 100% self-owned and independent of all investor decisions. Customers benefit from these years of experience, large user-base, and at the same time, appreciate developing with a mature, reliable product.

SD Times 100SD Times 100SD Times 100SD Times 100SD Times 100SD Times 100Visual Studio 2015 Launch PartnerVisual Studio 2013 Launch PartnerVisual Studio 2012 Launch PartnerVisual Studio Partner