ASP .NET MVC Button Tag Helper

The jqx-button tag helper adds a Button component to a web page. jqx-repeatbutton add a Repeat Button and jqx-togglebutton adds a toggle button to the web page.

@{
    ViewData["Title"] = "ASP .NET MVC Button, ToggleButton and RepeatButton Example";
}
<label>ASP .NET MVC Button, ToggleButton and RepeatButton Example</label><br/><br/>
<jqx-button theme="@ViewData["Theme"]" on-click="@Url.Action("Increment", "TagHelpers")">Button</jqx-button>
<jqx-togglebutton style="margin-left:20px;" theme="@ViewData["Theme"]">Toggle Button</jqx-togglebutton>
<jqx-repeatbutton style="margin-left:20px;" on-click="@Url.Action("Increment", "TagHelpers")" theme="@ViewData["Theme"]">Repeat Button</jqx-repeatbutton>

@{
    ViewData["Title"] = "ASP .NET MVC Button, ToggleButton and RepeatButton Example";
}
<label>ASP .NET MVC Button, ToggleButton and RepeatButton Example</label><br/><br/>
<jqx-button theme="@ViewData["Theme"]" on-click="@Url.Action("Increment", "TagHelpers")">Button</jqx-button>
<jqx-togglebutton style="margin-left:20px;" theme="@ViewData["Theme"]">Toggle Button</jqx-togglebutton>
<jqx-repeatbutton style="margin-left:20px;" on-click="@Url.Action("Increment", "TagHelpers")" theme="@ViewData["Theme"]">Repeat Button</jqx-repeatbutton>

ASP .NET MVC Button Group Tag Helper

The jqx-buttongroup tag helper adds a Button Group Chart component to a web page.

@{
    ViewData["Title"] = "ASP .NET MVC ButtonGroup Example";
}
<label>ASP .NET Core MVC Button Group Tag Helper Example</label><br/><br/>
Default Mode<br/>
<jqx-buttongroup theme="@ViewData["Theme"]" id='jqxWidget'>
    <button style="padding:4px 16px;">
        Left
    </button>
    <button style="padding:4px 16px;">
        Center
    </button>
    <button style="padding:4px 16px;">
        Right
    </button>
</jqx-buttongroup>
Radio Mode<br/>
<jqx-buttongroup id="buttongroup2" theme="@ViewData["Theme"]" mode="radio">
    <button style="padding:4px 16px;">
        Left
    </button>
    <button style="padding:4px 16px;">
        Center
    </button>
    <button style="padding:4px 16px;">
        Right
    </button>
</jqx-buttongroup>
CheckBox Mode<br/>
<jqx-buttongroup id="buttongroup3" theme="@ViewData["Theme"]" mode="checkbox">
    <button style="padding:4px 16px;">
        Left
    </button>
    <button style="padding:4px 16px;">
        Center
    </button>
    <button style="padding:4px 16px;">
        Right
    </button>
</jqx-buttongroup>

ASP .NET MVC Switch Button Tag Helper

The jqx-switchbutton tag helper adds a Switch Button component to a web page.

@{
    ViewData["Title"] = "ASP .NET MVC Switch Button Example";
}
<label>ASP .NET Core MVC SwitchButton Tag Helper Example</label><br/><br/>
<jqx-switchbutton theme="@ViewData["Theme"]" width="150" height="30"></jqx-switchbutton>

ASP .NET MVC Radio Button Tag Helper

The jqx-radiobutton tag helper adds a Radio Button component to a web page.

@model jQWidgetsDemosContext
@using jQWidgets.AspNet.Core.Models;
@{
    ViewData["Title"] = "ASP .NET MVC Radio Button Example";
    Contract contract = Model.ContractDuration;
    bool year = false;
    bool halfYear = false;
    bool quarterYear = false;
    bool month = false;
    if (contract == Contract.Year)
    {
        year = true;
    }
    if (contract == Contract.HalfYear)
    {
        halfYear = true;
    }
    if (contract == Contract.QuarterYear)
    {
        quarterYear = true;
    }
    if (contract == Contract.Month)
    {
        month = true;
    }
}
<label>ASP .NET Core MVC Radio Button Tag Helper Example</label><br/><br/>
<jqx-radiobutton width="200" height="30" theme="@ViewData["Theme"]" on-checked="@Url.Action("Year", "TagHelpers")" checked="year">12 Months Contract</jqx-radiobutton>
<jqx-radiobutton width="200" height="30" theme="@ViewData["Theme"]" on-checked="@Url.Action("HalfYear", "TagHelpers")" checked="halfYear">6 Months Contract</jqx-radiobutton>
<jqx-radiobutton width="200" height="30" theme="@ViewData["Theme"]" on-checked="@Url.Action("QuarterYear", "TagHelpers")" checked="quarterYear">3 Months Contract</jqx-radiobutton>
<jqx-radiobutton width="200" height="30" theme="@ViewData["Theme"]" on-checked="@Url.Action("Month", "TagHelpers")" checked="month">1 Month Contract</jqx-radiobutton>

ASP .NET MVC CheckBox Tag Helper

The jqx-checkbox tag helper adds a CheckBox component to a web page.

@{
    ViewData["Title"] = "ASP .NET MVC CheckBox Example";
}
<label>ASP .NET Core MVC CheckBox Example</label><br/><br/>
<form asp-action="CarFeatures" method="post">
    Choose Optional Features:
   @foreach (var item in Model.CarFeatures)
   {
        <jqx-checkbox height="30" name="carFeatures" checked="@item.Value" theme="@ViewData["Theme"]">@item.Key</jqx-checkbox>
   }
  <jqx-button type="submit" theme="@ViewData["Theme"]">Submit</jqx-button>
</form>

ASP .NET MVC Link Button Tag Helper

The jqx-linkbutton tag helper adds a Link Button component to a web page.

@{
    ViewData["Title"] = "ASP .NET MVC Link Button Example";
}
<label>ASP .NET Core MVC Link Button Tag Helper Example</label><br/><br/>
<jqx-linkbutton width="200px" height="25px" theme="@ViewData["Theme"]" target="_blank" href="http://www.jqwidgets.com">Link Button</jqx-linkbutton>