@page @using Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Demo.Pages.Components @model DynamicFormsModel @{ ViewData["Title"] = "Forms"; }

Dynamic Forms

# Dynamic Form Example


Posted Values:
Name: @Model.PersonInput.Name
City: @Model.PersonInput.City
Phone.Name: @Model.PersonInput.Phone.Name
Phone.Number: @Model.PersonInput.Phone.Number
Day: @Model.PersonInput.Day.ToString("yyyy-MM-dd")
Country: @Model.PersonInput.Country
IsActive: @Model.PersonInput.IsActive
<abp-dynamic-form abp-model="Model.PersonInput"/>

# Override an input Example


Posted Values:
Name: @Model.PersonInput.Name
City: @Model.PersonInput.City
Phone.Name: @Model.PersonInput.Phone.Name
Phone.Number: @Model.PersonInput.Phone.Number
Day: @Model.PersonInput.Day.ToString("yyyy-MM-dd")
Country: @Model.PersonInput.Country
IsActive: @Model.PersonInput.IsActive
<abp-dynamic-form abp-model="Model.PersonInput">
    <abp-input asp-for="Model.PersonInput.Phone.Number" />
    <abp-button button-type="Primary" type="submit" text="submit" />
</abp-dynamic-form>

# Form with Button Example


Posted Values:
Name: @Model.PersonInput.Name
City: @Model.PersonInput.City
Phone.Name: @Model.PersonInput.Phone.Name
Phone.Number: @Model.PersonInput.Phone.Number
Day: @Model.PersonInput.Day.ToString("yyyy-MM-dd")
Country: @Model.PersonInput.Country
IsActive: @Model.PersonInput.IsActive
<abp-dynamic-form abp-model="Model.PersonInput" submit-button="true"/>

# Non-dynamic Form


Posted Values:
Name: @Model.PersonInput.Name
Age: @Model.PersonInput.Age
Is Active: @Model.PersonInput.IsActive
Day: @Model.PersonInput.Day
City: @Model.PersonInput.City
Country: @Model.PersonInput.Country
Phone.Number: @Model.PersonInput.Phone.Number
Phone.Name: @Model.PersonInput.Phone.Name
<form method="post">
    <abp-input asp-for="Model.PersonInput.Name" />
    <abp-input asp-for="Model.PersonInput.Age" />
    <abp-input asp-for="Model.PersonInput.IsActive" />
    <abp-input asp-for="Model.PersonInput.Day" />
    <abp-select asp-for="Model.PersonInput.City" />
    <abp-select asp-for="Model.PersonInput.Country" />
    <abp-input asp-for="Model.PersonInput.Phone.Number" />
    <abp-input asp-for="Model.PersonInput.Phone.Name" />
    <abp-button type="submit" button-type="Primary" text="Submit" />
</form>

# Form Content Placement


Posted Values:
Name: @Model.PersonInput.Name
City: @Model.PersonInput.City
Phone.Name: @Model.PersonInput.Phone.Name
Phone.Number: @Model.PersonInput.Phone.Number
Day: @Model.PersonInput.Day.ToString("yyyy-MM-dd")
Country: @Model.PersonInput.Country
IsActive: @Model.PersonInput.IsActive
<abp-dynamic-form abp-model="@Model.PersonInput">
     <abp-form-content />
     <abp-button button-type="Primary" type="submit" text="submit" />
</abp-dynamic-form>