webentwicklung-frage-antwort-db.com.de

Hilfsprogramme für Optionsfelder in ASP.NET 5 MVC 6

In ASP.NET 5 MVC 6 werden keine Tag-Helfer für Optionsfelder angezeigt. Was ist der richtige Umgang mit Formularelementen, wenn ich Optionsfelder verwenden muss?

21
Sam

Es gibt einen TagHelper für alle Eingangstypen, der auch den Auswahlknopftyp enthält. Angenommen, Sie haben ein Ansichtsmodell wie dieses

public class CreateUserVm
{
    public string UserName { set; get; }
    public IEnumerable<RoleVm> Roles { set; get; } 
    public int SelectedRole { set; get; }
}
public class RoleVm
{
    public int Id { set; get; }
    public string RoleName { set; get; }        
}

Und in Ihrer GET-Aktion,

public IActionResult Index()
{
    var vm = new CreateUserVm
    {
        Roles = new List<RoleVm>
        {
            new RoleVm {Id = 1, RoleName = "Admin"},
            new RoleVm {Id = 2, RoleName = "Editor"},
            new RoleVm {Id = 3, RoleName = "Reader"}
        }
    };
    return View(vm);
}

In der Ansicht können Sie einfach Markup für das Eingabe-Tag verwenden.

@model YourNamespaceHere.CreateUserVm
<form asp-action="Index" asp-controller="Home">
    <label class="label">User name</label>
    <div class="col-md-10">
        <input type="text" asp-for="UserName" />
    </div>
    <label class="label">Select a Role</label>
    <div class="col-md-10">
    @foreach (var item in Model.Roles)
    {
       <input asp-for="SelectedRole" type="radio" value="@item.Id" /> @item.RoleName
    }
    </div>
    <input type="submit" />
</form>

Wenn Sie Ihr Formular bereitstellen, befindet sich die Rold-ID für die ausgewählte Rolle in der SelectedRole-Eigenschaft

Beachten Sie, dass der obige Rasierercode für jede durch die Schleife erzeugte Eingabe ein Eingabeelement mit dem Attributwert same Id und dem Wert name des Attributs generiert. Im obigen Beispiel werden drei Eingabeelemente (Optionsfeldtyp) generiert, wobei der Attributwert Id und name auf SelectedRole gesetzt ist. Die Modellbindung funktioniert, wenn der Attributwert name mit dem Eigenschaftennamen (SelectedRole) in unserem Ansichtsmodell übereinstimmt. Die doppelten ID-Attributwerte können jedoch zu Problemen mit dem clientseitigen Code führen.

32
Shyju

Obwohl es asp-for="SomeField"-Lösungen gibt, fand ich, dass die einfachste Lösung darin bestand, ein Ansichtsmodellfeld einfach mit dem name-Feld des Optionsfelds abzugleichen. 

Modell anzeigen:

public class MyViewModel
{
   public string MyRadioField { get; set; }
}

Formular (ohne Beschriftungen zur Verdeutlichung):

@model MyViewModel
<form asp-action="SomeAction" asp-controller="SomeController">
   <input type="radio" name="MyRadioField" value="option1" checked />
   <input type="radio" name="MyRadioField" value="option2" />
   <input type="radio" name="MyRadioField" value="option3" />

   <input type="submit" />
</form>

Wenn das Formular gesendet wird, wird MyRadioField mit dem Wert des aktivierten Optionsfelds gefüllt. 

1
Corey