記事編集

日付

ジャンルのカテゴリ―名

タイトル

内容の要旨

<p data-bm="32" style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin: 4px; padding: revert; -webkit-line-clamp: revert; color: rgba(0, 0, 0, 0.8); font-family: Roboto, Helvetica, sans-serif; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: normal; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;" data-pasted="true">了解です。<br>ASP.NET Core MVC で&nbsp;<strong style="font-weight: 700;">ドロップダウン（ViewData[&quot;Category&quot;]）</strong> と&nbsp;<strong style="font-weight: 700;">ユーザー入力欄</strong> を併用し、<br>「その他」選択時だけ入力欄を表示し、DB登録まで行う&nbsp;<strong style="font-weight: 700;">Create</strong> アクションの実装例を示します。</p><h2 data-bm="33" style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin: revert; padding: revert; font: 22px / 24px Roboto, Helvetica, sans-serif; height: 32px; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; color: rgba(0, 0, 0, 0.8); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: normal; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;">1. モデル定義</h2><pre data-priority="2" data-bm="34" style="background: none 0% 0% / auto repeat scroll padding-box border-box rgb(245, 245, 245); border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 8px; overflow: hidden; color: rgba(0, 0, 0, 0.8); font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;"><div data-bm="44" style="display: flex; height: 28px; flex-direction: row; justify-content: space-between; align-items: center; gap: 8px; padding: 8px 12px; border-bottom: 1px solid rgba(0, 0, 0, 0.1); background: none 0% 0% / auto repeat scroll padding-box border-box rgb(248, 244, 241);"><h5 style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin: 0px; padding: revert; font-style: normal !important; font-variant: normal !important; font-weight: 400 !important; font-stretch: 100% !important; line-height: 18px; font-family: Roboto, Helvetica, sans-serif !important; font-optical-sizing: auto !important; font-size-adjust: none !important; font-kerning: auto !important; font-feature-settings: normal !important; font-variation-settings: normal !important; font-language-override: normal !important; font-size: 16px; display: inline-block; color: rgb(60, 81, 180);">Csharp</h5><div style="height: 28px;"><button type="button" tabindex="" title="Copy code" style="box-sizing: border-box; margin: 0px; padding: 0px; font: 400 13px / 20px Roboto, Helvetica, sans-serif; background-color: rgb(217, 223, 251); border: 1px solid rgba(0, 0, 0, 0); display: grid; grid-auto-flow: column; align-items: center; cursor: pointer; color: rgb(60, 81, 180) !important; text-decoration: none !important; border-radius: 9999px; block-size: 28px; gap: 2px; padding-inline: 10px;"><div style="box-sizing: border-box; margin: 0px; padding: 0px; min-inline-size: 0px; max-inline-size: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: clip; max-block-size: calc(1lh); padding-inline: 2px;">Copy code</div></button></div></div><code style="border-radius: 8px; background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255); display: block; white-space: pre-wrap; overflow-wrap: anywhere; padding: 8px 16px 16px;"><span style="color: rgb(106, 115, 125);">// Models/Product.cs</span>
<span style="color: rgb(215, 58, 73);">using</span> System.ComponentModel.DataAnnotations;

<span style="color: rgb(215, 58, 73);">public</span> <span style="color: rgb(215, 58, 73);">class</span> <span style="color: rgb(111, 66, 193);">Product</span>
{
    <span style="color: rgb(215, 58, 73);">public</span> <span style="color: rgb(227, 98, 9);">int</span> Id { <span style="color: rgb(215, 58, 73);">get</span>; <span style="color: rgb(215, 58, 73);">set</span>; }

    [<span style="color: rgb(0, 92, 197);">Required</span>]
    <span style="color: rgb(215, 58, 73);">public</span> <span style="color: rgb(227, 98, 9);">string</span> Category { <span style="color: rgb(215, 58, 73);">get</span>; <span style="color: rgb(215, 58, 73);">set</span>; } = <span style="color: rgb(227, 98, 9);">string</span>.Empty;

    <span style="color: rgb(215, 58, 73);">public</span> <span style="color: rgb(227, 98, 9);">string</span>? OtherCategory { <span style="color: rgb(215, 58, 73);">get</span>; <span style="color: rgb(215, 58, 73);">set</span>; }
}
</code></pre><h2 data-bm="35" style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin: revert; padding: revert; font: 22px / 24px Roboto, Helvetica, sans-serif; height: 32px; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; color: rgba(0, 0, 0, 0.8); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: normal; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;">2. コントローラー</h2><pre data-priority="2" data-bm="36" style="background: none 0% 0% / auto repeat scroll padding-box border-box rgb(245, 245, 245); border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 8px; overflow: hidden; color: rgba(0, 0, 0, 0.8); font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;"><div data-bm="45" style="display: flex; height: 28px; flex-direction: row; justify-content: space-between; align-items: center; gap: 8px; padding: 8px 12px; border-bottom: 1px solid rgba(0, 0, 0, 0.1); background: none 0% 0% / auto repeat scroll padding-box border-box rgb(248, 244, 241);"><h5 style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin: 0px; padding: revert; font-style: normal !important; font-variant: normal !important; font-weight: 400 !important; font-stretch: 100% !important; line-height: 18px; font-family: Roboto, Helvetica, sans-serif !important; font-optical-sizing: auto !important; font-size-adjust: none !important; font-kerning: auto !important; font-feature-settings: normal !important; font-variation-settings: normal !important; font-language-override: normal !important; font-size: 16px; display: inline-block; color: rgb(60, 81, 180);">Csharp</h5><div style="height: 28px;"><button type="button" tabindex="" title="Copy code" style="box-sizing: border-box; margin: 0px; padding: 0px; font: 400 13px / 20px Roboto, Helvetica, sans-serif; background-color: rgb(217, 223, 251); border: 1px solid rgba(0, 0, 0, 0); display: grid; grid-auto-flow: column; align-items: center; cursor: pointer; color: rgb(60, 81, 180) !important; text-decoration: none !important; border-radius: 9999px; block-size: 28px; gap: 2px; padding-inline: 10px;"><div style="box-sizing: border-box; margin: 0px; padding: 0px; min-inline-size: 0px; max-inline-size: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: clip; max-block-size: calc(1lh); padding-inline: 2px;">Copy code</div></button></div></div><code style="border-radius: 8px; background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255); display: block; white-space: pre-wrap; overflow-wrap: anywhere; padding: 8px 16px 16px;"><span style="color: rgb(106, 115, 125);">// Controllers/ProductsController.cs</span>
<span style="color: rgb(215, 58, 73);">using</span> Microsoft.AspNetCore.Mvc;
<span style="color: rgb(215, 58, 73);">using</span> Microsoft.AspNetCore.Mvc.Rendering;

<span style="color: rgb(215, 58, 73);">public</span> <span style="color: rgb(215, 58, 73);">class</span> <span style="color: rgb(111, 66, 193);">ProductsController</span> : <span style="color: rgb(111, 66, 193);">Controller</span>
{
    <span style="color: rgb(215, 58, 73);">private</span> <span style="color: rgb(215, 58, 73);">readonly</span> ApplicationDbContext _context;

    <span style="color: rgb(215, 58, 73);">public</span> <span style="color: rgb(111, 66, 193);">ProductsController</span>(ApplicationDbContext context)
    {
        _context = context;
    }

    <span style="color: rgb(106, 115, 125);">// GET: Create</span>
    <span style="color: rgb(215, 58, 73);">public</span> IActionResult <span style="color: rgb(111, 66, 193);">Create</span>()
    {
        ViewData[<span style="color: rgb(3, 47, 98);">&quot;Category&quot;</span>] = <span style="color: rgb(215, 58, 73);">new</span> SelectList(<span style="color: rgb(215, 58, 73);">new</span>[]
        {
            <span style="color: rgb(3, 47, 98);">&quot;食品&quot;</span>, <span style="color: rgb(3, 47, 98);">&quot;衣類&quot;</span>, <span style="color: rgb(3, 47, 98);">&quot;家電&quot;</span>, <span style="color: rgb(3, 47, 98);">&quot;その他&quot;</span>
        });
        <span style="color: rgb(215, 58, 73);">return</span> View();
    }

    <span style="color: rgb(106, 115, 125);">// POST: Create</span>
    [<span style="color: rgb(0, 92, 197);">HttpPost</span>]
    [<span style="color: rgb(0, 92, 197);">ValidateAntiForgeryToken</span>]
    <span style="color: rgb(215, 58, 73);">public</span> IActionResult <span style="color: rgb(111, 66, 193);">Create</span>(Product product)
    {
        <span style="color: rgb(215, 58, 73);">if</span> (product.Category == <span style="color: rgb(3, 47, 98);">&quot;その他&quot;</span> &amp;&amp; <span style="color: rgb(227, 98, 9);">string</span>.IsNullOrWhiteSpace(product.OtherCategory))
        {
            ModelState.AddModelError(<span style="color: rgb(3, 47, 98);">&quot;OtherCategory&quot;</span>, <span style="color: rgb(3, 47, 98);">&quot;その他を選択した場合は入力してください。&quot;</span>);
        }

        <span style="color: rgb(215, 58, 73);">if</span> (ModelState.IsValid)
        {
            <span style="color: rgb(106, 115, 125);">// 「その他」選択時は OtherCategory を Category に反映</span>
            <span style="color: rgb(215, 58, 73);">if</span> (product.Category == <span style="color: rgb(3, 47, 98);">&quot;その他&quot;</span> &amp;&amp; !<span style="color: rgb(227, 98, 9);">string</span>.IsNullOrWhiteSpace(product.OtherCategory))
            {
                product.Category = product.OtherCategory;
            }

            _context.Add(product);
            _context.SaveChanges();
            <span style="color: rgb(215, 58, 73);">return</span> RedirectToAction(<span style="color: rgb(215, 58, 73);">nameof</span>(Index));
        }

        <span style="color: rgb(106, 115, 125);">// 再描画用に ViewData を再設定</span>
        ViewData[<span style="color: rgb(3, 47, 98);">&quot;Category&quot;</span>] = <span style="color: rgb(215, 58, 73);">new</span> SelectList(<span style="color: rgb(215, 58, 73);">new</span>[]
        {
            <span style="color: rgb(3, 47, 98);">&quot;食品&quot;</span>, <span style="color: rgb(3, 47, 98);">&quot;衣類&quot;</span>, <span style="color: rgb(3, 47, 98);">&quot;家電&quot;</span>, <span style="color: rgb(3, 47, 98);">&quot;その他&quot;</span>
        }, product.Category);

        <span style="color: rgb(215, 58, 73);">return</span> View(product);
    }
}
</code></pre><h2 data-bm="37" style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin: revert; padding: revert; font: 22px / 24px Roboto, Helvetica, sans-serif; height: 32px; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; color: rgba(0, 0, 0, 0.8); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: normal; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;">3. ビュー（Razor）</h2><pre data-priority="2" data-bm="38" style="background: none 0% 0% / auto repeat scroll padding-box border-box rgb(245, 245, 245); border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 8px; overflow: hidden; color: rgba(0, 0, 0, 0.8); font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;"><div data-bm="46" style="display: flex; height: 28px; flex-direction: row; justify-content: space-between; align-items: center; gap: 8px; padding: 8px 12px; border-bottom: 1px solid rgba(0, 0, 0, 0.1); background: none 0% 0% / auto repeat scroll padding-box border-box rgb(248, 244, 241);"><h5 style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin: 0px; padding: revert; font-style: normal !important; font-variant: normal !important; font-weight: 400 !important; font-stretch: 100% !important; line-height: 18px; font-family: Roboto, Helvetica, sans-serif !important; font-optical-sizing: auto !important; font-size-adjust: none !important; font-kerning: auto !important; font-feature-settings: normal !important; font-variation-settings: normal !important; font-language-override: normal !important; font-size: 16px; display: inline-block; color: rgb(60, 81, 180);">Cshtml</h5><div style="height: 28px;"><button type="button" tabindex="" title="Copy code" style="box-sizing: border-box; margin: 0px; padding: 0px; font: 400 13px / 20px Roboto, Helvetica, sans-serif; background-color: rgb(217, 223, 251); border: 1px solid rgba(0, 0, 0, 0); display: grid; grid-auto-flow: column; align-items: center; cursor: pointer; color: rgb(60, 81, 180) !important; text-decoration: none !important; border-radius: 9999px; block-size: 28px; gap: 2px; padding-inline: 10px;"><div style="box-sizing: border-box; margin: 0px; padding: 0px; min-inline-size: 0px; max-inline-size: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: clip; max-block-size: calc(1lh); padding-inline: 2px;">Copy code</div></button></div></div><code style="border-radius: 8px; background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255); display: block; white-space: pre-wrap; overflow-wrap: anywhere; padding: 8px 16px 16px;">@model Product
@{
    ViewData[&quot;Title&quot;] = &quot;Create&quot;;
}

&lt;h2&gt;Create&lt;/h2&gt;

&lt;form asp-action=&quot;Create&quot; method=&quot;post&quot;&gt;
    &lt;div class=&quot;form-group&quot;&gt;
        &lt;label asp-for=&quot;Category&quot;&gt;&lt;/label&gt;
        &lt;select asp-for=&quot;Category&quot; class=&quot;form-control&quot;
                asp-items=&quot;@(ViewData[&quot;Category&quot;] as SelectList)&quot; id=&quot;categorySelect&quot;&gt;
        &lt;/select&gt;
        &lt;span asp-validation-for=&quot;Category&quot; class=&quot;text-danger&quot;&gt;&lt;/span&gt;
    &lt;/div&gt;

    &lt;div class=&quot;form-group&quot; id=&quot;otherCategoryDiv&quot; style=&quot;display:none;&quot;&gt;
        &lt;label asp-for=&quot;OtherCategory&quot;&gt;その他のカテゴリ&lt;/label&gt;
        &lt;input asp-for=&quot;OtherCategory&quot; class=&quot;form-control&quot; /&gt;
        &lt;span asp-validation-for=&quot;OtherCategory&quot; class=&quot;text-danger&quot;&gt;&lt;/span&gt;
    &lt;/div&gt;

    &lt;button type=&quot;submit&quot; class=&quot;btn btn-primary&quot;&gt;登録&lt;/button&gt;
&lt;/form&gt;

@section Scripts {
    &lt;partial name=&quot;_ValidationScriptsPartial&quot; /&gt;
    &lt;script&gt;
        const categorySelect = document.getElementById(&quot;categorySelect&quot;);
        const otherDiv = document.getElementById(&quot;otherCategoryDiv&quot;);

        function toggleOtherInput() {
            if (categorySelect.value === &quot;その他&quot;) {
                otherDiv.style.display = &quot;block&quot;;
            } else {
                otherDiv.style.display = &quot;none&quot;;
                document.querySelector(&quot;[name=&#39;OtherCategory&#39;]&quot;).value = &quot;&quot;;
            }
        }

        categorySelect.addEventListener(&quot;change&quot;, toggleOtherInput);
        toggleOtherInput(); // 初期表示時
    &lt;/script&gt;
}
</code></pre><h2 data-bm="39" style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin: revert; padding: revert; font: 22px / 24px Roboto, Helvetica, sans-serif; height: 32px; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; color: rgba(0, 0, 0, 0.8); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: normal; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;">4. 動作の流れ</h2><ol data-bm="40" style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin: revert; padding: revert; color: rgba(0, 0, 0, 0.8); font-family: Roboto, Helvetica, sans-serif; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: normal; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;"><li style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin-top: revert; margin-right: revert; margin-bottom: 8px; margin-left: revert; padding: revert;"><strong style="font-weight: 700;">Create GET</strong><ul style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin: revert; padding: revert;"><li style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin-top: revert; margin-right: revert; margin-bottom: 8px; margin-left: revert; padding: revert;">ViewData[&quot;Category&quot;] にカテゴリ一覧を設定し、ビューに渡す。</li></ul></li><li style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin-top: revert; margin-right: revert; margin-bottom: 8px; margin-left: revert; padding: revert;"><strong style="font-weight: 700;">ビュー</strong><ul style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin: revert; padding: revert;"><li style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin-top: revert; margin-right: revert; margin-bottom: 8px; margin-left: revert; padding: revert;"><code style="border-radius: 8px; background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255);">&lt;select&gt;</code> でカテゴリ選択。</li><li style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin-top: revert; margin-right: revert; margin-bottom: 8px; margin-left: revert; padding: revert;">「その他」選択時のみ&nbsp;<code style="border-radius: 8px; background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255);">&lt;input&gt;</code> が表示される（JavaScriptで制御）。</li></ul></li><li style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin-top: revert; margin-right: revert; margin-bottom: 8px; margin-left: revert; padding: revert;"><strong style="font-weight: 700;">Create POST</strong><ul style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin: revert; padding: revert;"><li style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin-top: revert; margin-right: revert; margin-bottom: 8px; margin-left: revert; padding: revert;">「その他」選択時は&nbsp;<code style="border-radius: 8px; background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255);">OtherCategory</code> の入力必須チェック。</li><li style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin-top: revert; margin-right: revert; margin-bottom: 8px; margin-left: revert; padding: revert;">DB登録時は&nbsp;<code style="border-radius: 8px; background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255);">Category</code> に&nbsp;<code style="border-radius: 8px; background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255);">OtherCategory</code> の値を反映。</li></ul></li><li style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin-top: revert; margin-right: revert; margin-bottom: 8px; margin-left: revert; padding: revert;"><strong style="font-weight: 700;">DB保存</strong><ul style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin: revert; padding: revert;"><li style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin-top: revert; margin-right: revert; margin-bottom: 8px; margin-left: revert; padding: revert;"><code style="border-radius: 8px; background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255);">_context.SaveChanges()</code> で永続化。</li></ul></li></ol><p data-bm="41" style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin: 4px; padding: revert; -webkit-line-clamp: revert; color: rgba(0, 0, 0, 0.8); font-family: Roboto, Helvetica, sans-serif; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: normal; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;">✅ この方法なら、</p><ul data-bm="42" style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin: revert; padding: revert; color: rgba(0, 0, 0, 0.8); font-family: Roboto, Helvetica, sans-serif; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: normal; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;"><li style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin-top: revert; margin-right: revert; margin-bottom: 8px; margin-left: revert; padding: revert;"><strong style="font-weight: 700;">ViewData + SelectList</strong> を使ったドロップダウン</li><li style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin-top: revert; margin-right: revert; margin-bottom: 8px; margin-left: revert; padding: revert;">「その他」選択時だけ表示される入力欄</li><li style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin-top: revert; margin-right: revert; margin-bottom: 8px; margin-left: revert; padding: revert;">入力必須バリデーション</li><li style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin-top: revert; margin-right: revert; margin-bottom: 8px; margin-left: revert; padding: revert;">DB登録までの一連の流れ<br>が実現できます。</li></ul><p data-bm="43" style="border: 0px; border-collapse: collapse; border-spacing: 0px; list-style-position: initial; list-style-image: initial; list-style-type: revert; margin: 4px; padding: revert; -webkit-line-clamp: revert; color: rgba(0, 0, 0, 0.8); font-family: Roboto, Helvetica, sans-serif; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: normal; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;">もし希望があれば、このコードを&nbsp;<strong style="font-weight: 700;">非同期（AJAX）送信対応版</strong> に書き換えて、ページリロードなしで登録できる形にもできますが、そうしますか？</p><p data-f-id="pbf" style="text-align: center; font-size: 14px; margin-top: 30px; opacity: 0.65; font-family: sans-serif;">Powered by <a href="https://www.froala.com/wysiwyg-editor?pb=1" title="Froala Editor">Froala Editor</a></p>

添付画像

画像を変更

Back to List

//検索文：Editor内でHTMLコードをコピーさせる