MultiAutoComplete
MultiAutoComplete
概要
このサンプルは、MultiAutoComplete コントロールの基本的な使用方法を示します。
機能
サンプル
国名をキー入力します。
説明
MultiAutoComplete コントロールを使用すると、カスタムオブジェクトや 単純な文字列を含むリストから項目を選択できます。
このサンプルの MultiAutoComplete コントロールは、文字列配列を ItemsSource として使用します。 最大トークンフィールド数は 4 に設定されています。
ソース
IndexController.cs
using Microsoft.AspNetCore.Mvc; namespace MvcExplorer.Controllers { public partial class MultiAutoCompleteController : Controller { public ActionResult Index() { return View(Models.Countries.GetCountries()); } } }
Index.cshtml
@model List<string> @section Styles{ <style> .highlight { background-color: #ff0; color: #000; } </style> } <p>@Html.Raw(MultiAutoCompleteRes.Index_Text0)</p> <c1-multi-auto-complete css-match="highlight" max-selected-items="4" selected-indexes="new List<int> { 1 }"> <c1-items-source source-collection="@Model"></c1-items-source> </c1-multi-auto-complete> @section Summary{ @Html.Raw(MultiAutoCompleteRes.Index_Text3) } @section Description{ <p>@Html.Raw(MultiAutoCompleteRes.Index_Text1)</p> <p>@Html.Raw(MultiAutoCompleteRes.Index_Text2)</p> }
マニュアル