.NET Core第19天_SelectTagHelper的使用

SelectTagHelper : 是对HTML原生 tag的封装
预设下拉选单会透过asp-for来设置select元素的模型属性名称，asp-items指定option元素。

新增好一个SelectController.cs跟相应Index检视

SelectController.cs

using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.Rendering;
using Net5App6.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;

namespace Net5App6.Controllers
{
    public class SelectController : Controller
    {
        [HttpGet]
        public IActionResult Index()
        {
            SelectViewModel model = new SelectViewModel();
            model.SelectLists = new List<SelectListItem>()
            {
                new SelectListItem() { Text="台北市",Value="Taipei"},
                new SelectListItem(){ Text="高雄市",Value="Kaohsiung",Selected=true},
                new SelectListItem(){ Text="新竹市",Value="Hsinchu"}
            };
            return View(model);
        }


        [HttpPost]
        public IActionResult Index(SelectViewModel model)
        {
            var name = model.City;

            return View(model);
        }
    }
}

Index.cshtml

@model SelectViewModel

<form method="post">
    <div>
        <label asp-for="City"></label>
        <select asp-for="City" asp-items="Model.SelectLists"></select>
    </div>
    <div>
        <input type="submit" value="提交" />
    </div>
</form>

对应检视模型 SelectViewModel

using Microsoft.AspNetCore.Mvc.Rendering;
using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Threading.Tasks;

namespace Net5App6.Models
{
    public class SelectViewModel
    {
        [Display(Name = "直辖市")]
        public string City { get; set; }

        public List<SelectListItem> SelectLists { get; set; }
    }
}

运行效果