This section briefly explains about how to include a simple ButtonGroup in your ASP.NET MVC application. You can refer ASP.NET MVC Getting Started documentation page for introduction part of the system requirements and configure the common specifications.
To create simple ButtonGroup add the div tag with class name as e-btn-group
and add Button
component that should
inside the div
element in your Index.cshtml page.
<div class='e-btn-group'>
@Html.EJS().Button("html").Content("HTML").Render()
@Html.EJS().Button("css").Content("CSS").Render()
@Html.EJS().Button("javacript").Content("Javascript").Render()
</div>
public ActionResult Index()
{
return View();
}
Output be like the below.
After successful compilation of your application, simply press F5
to run the application.
The following example shows a default rendering of ButtonGroup.
<div class='e-btn-group'>
@Html.EJS().Button("html").Content("HTML").Render()
@Html.EJS().Button("css").Content("CSS").Render()
@Html.EJS().Button("javacript").Content("Javascript").Render()
</div>
public ActionResult Index()
{
return View();
}
ButtonGroup can be arranged in a vertical and horizontal orientation. By default, it is horizontally aligned.
ButtonGroup can be aligned vertically by using the built-in CSS class e-vertical
to the target element.
The following example illustrates how to achieve vertical orientation in ButtonGroup.
<div class='e-btn-group e-vertical'>
@Html.EJS().Button("html").Content("HTML").Render()
@Html.EJS().Button("css").Content("CSS").Render()
@Html.EJS().Button("javacript").Content("Javascript").Render()
</div>
public ActionResult Index()
{
return View();
}
ButtonGroup does not support SplitButton component nesting in a vertical orientation.