Skip to main content

This is a new service.

Button

Read more about the button component on the Gov.UK Design System website

@using GovUkDesignSystemDotNet

@await Html.GovUkButton(new ButtonViewModel
{
    HtmlOrText = new HtmlOrText("Save and continue"),
})

Options

Options for ButtonViewModel
Name Type Description
Element ButtonElementType?
nullable enum
Deprecated in 5.1.0

HTML element for the button component – Input, Button or A. In most cases you will not need to set this as it will be configured automatically if href is provided.
HtmlOrText HtmlOrText Required. Text for the input, button or a element. Instantiate an HtmlOrText class either with a string (for text) or using the @<text></text> syntax for HTML.
Name string Name for the input or button. This has no effect on a elements.
Type string Type for the input or button element – "button", "submit" or "reset". Defaults to "submit". This has no effect on a elements.
Value string Value for the button element only. This has no effect on a or input elements.
Disabled bool Whether the button component should be disabled. For input and button elements, disabled and aria-disabled attributes will be set automatically. This has no effect on a elements.
Href string The URL that the button component should link to. If this is set, element will be automatically set to A if it has not already been defined.
Classes List<string> Classes to add to the button component.
Attributes Dictionary<string, string> HTML attributes (for example data attributes) to add to the button component.
PreventDoubleClick bool Prevent accidental double clicks on submit buttons from submitting forms multiple times.
IsStartButton bool Use for the main call to action on your service’s start page.
Id string The ID of the button.

Examples

Using HtmlOrText

@using GovUkDesignSystemDotNet

<p class="govuk-body">Button with HTML:</p>
@await Html.GovUkButton(new ButtonViewModel
{
    HtmlOrText = new HtmlOrText(@<text>Save <i>AND</i> continue</text>),
})

<p class="govuk-body">Button with text:</p>
@await Html.GovUkButton(new ButtonViewModel
{
    HtmlOrText = new HtmlOrText("Save and continue"),
})

Start button

@using GovUkDesignSystemDotNet

@await Html.GovUkButton(new ButtonViewModel
{
    HtmlOrText = new HtmlOrText("Start now"),
    IsStartButton = true
})