FormLayout

Ordne etiketter og felt i et responsivt rutenett med tolv kolonner og seksjoner med tittel, slik at skjemaer ser ryddige ut på hver skjerm.

Hvorfor det hjelper

• Responsivt rutenett
• Seksjoner med tittel
• Etiketter koblet til felt

Hvor det passer

• Innstillings- og profilsider
• Administrasjonsskjemaer
• Dialoger

Eksempel

<FormLayout LabelPosition="FormLabelPosition.Start" Spacing="3">
    <FormLayoutItem Label="Name" HelperText="As on your ID.">
        <TextField @bind-Value="_name" />
    </FormLayoutItem>
    <FormLayoutItem Label="Email">
        <TextField @bind-Value="_email" Type="email" />
    </FormLayoutItem>
    <FormLayoutItem Label="Notes">
        <TextField @bind-Value="_notes" Lines="3" />
    </FormLayoutItem>
    <FormLayoutItem Label="Subscribe">
        <Switch @bind-Value="_subscribe" Label="Send me the newsletter" />
    </FormLayoutItem>
</FormLayout>

@code {
    private string? _name;
    private string? _email;
    private string? _notes;
    private bool _subscribe = true;
}

Et kort utdrag. Legg til @using RayCraft.Blazor.Components på siden din, og bruk en interaktiv gjengivelsesmodus.

Inkludert i RayCraft Free. Fungerende eksempler finnes i GitHub-arkiv (MIT); det inneholder eksempel- og demokode, ikke bibliotekets kode.

Alle kontroller · Dokumentasjon