Getting Started with ASP.NET Core SplitButton

30 Apr 20211 minute to read

This section explains briefly about how to create a Split Button in ASP.NET Core application.

Create your first Split Button in ASP.NET Core

The HTML button element and the <UL>, <LI> can be easily configured as Essential ASP.NET Core Split Button control. The basic rendering of Essential ASP.NET Core Split Button is achieved by using default functionality. Initially the TargetID is a mandatory one, without this field it acts as normal button on two sides.

Create Split Button Control in ASP.NET Core

Essential ASP.NET Core Split Button control contains built-in features such as Click and different option choosing. You can easily create the Split Button control by using Tag helper as follows.

  1. You can create a .NetCore Project with the help of the given ASP.NET Core-Getting Started documentation.
  2. Add the following code to the corresponding View page to render Split Button.

    ~~~ cshtml

/ej-Tag Helper code to render SplitButton/

<ej-split-button id="sbutton" text="Save" show-rounded-corner="true" size="Large" target-id="target" />

<li role="presentation" class=""><a data-target="#vu0usnesafj1pvd0lbife61mcehcnuc8-aspx-cs" aria-controls="home" role="tab" data-toggle="tab" data-original-lang="razor">CSHTML</a></li><div role="tabpanel" class="tab-pane" id="vu0usnesafj1pvd0lbife61mcehcnuc8-aspx-cs" data-original-lang = "razor" ><div class="highlight"><pre><code class="language-aspx-cs" data-lang="aspx-cs"><span></span>/*Razor code to render SplitButton*/


N> To render the SplitButton Control you can use either Razor or Tag helper code as given in the above code snippet.

3. Add the following <UL>, <LI> elements to render Split Button with popup option.

   ~~~ cshtml
   <ul id="target">





Output of the above scripts,