SkyoceanHome
Home
Privacy
ダウンロード
SkyShop
Updated Information
チュートリアルコード集
References
記事編集
日付
ジャンルのカテゴリ―名
名前を選択して下さい。
Contexts
Controllers
Databases
Htmls
JavaScripts
Models
MVCTutorials
Others
Styles
Views
タイトル
内容の要旨
<pre data-priority="2" 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;" data-pasted="true"><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;">@* Create.cshtml *@ @using Microsoft.AspNetCore.Mvc.Rendering @{ // ViewData["SubjectNameId"] は SelectList として渡されている前提 var subjectNames = ((SelectList)ViewData["SubjectNameId"]) .Select(x => x.Text) .ToList(); } <!-- ファイル選択 --> <input type="file" id="upFile" name="upFile" class="form-control" accept="image/*" /> <!-- CourseName --> <input asp-for="CourseName" class="form-control" id="CourseName" /> <!-- ImageUrl --> <input asp-for="ImageUrl" class="form-control" id="ImageUrl" /> @section Scripts { <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script> <script> $(document).ready(function () { // RazorからC#配列をJavaScript配列に変換 var subjectNames = @Html.Raw(System.Text.Json.JsonSerializer.Serialize(subjectNames)); // ページ読み込み時にモーダル表示 Swal.fire({ title: '追加するアイコンを選択してください', icon: 'question', showCancelButton: true, confirmButtonText: 'Yes', cancelButtonText: 'No' }).then((result) => { if (result.isConfirmed) { // ファイル選択イベントを待つ $('#upFile').on('change', function () { var file = this.files[0]; if (!file) { Swal.fire('エラー', 'ファイルが選択されていません。', 'error'); return; } // ファイル名と拡張子を分離 var fileName = file.name; var lastDotIndex = fileName.lastIndexOf('.'); var baseName = lastDotIndex > 0 ? fileName.substring(0, lastDotIndex) : fileName; var ext = lastDotIndex > 0 ? fileName.substring(lastDotIndex) : ''; // CourseName にセット $('#CourseName').val(baseName); // ImageUrl にセット $('#ImageUrl').val('/Images/' + fileName); // リスト内に存在するかチェック if (subjectNames.includes(baseName)) { Swal.fire('OK', 'この名前は既にリストに存在します。', 'info'); } else { Swal.fire('OK', 'この名前はリストに存在しません。', 'warning'); } }); // ファイル選択ダイアログを開く $('#upFile').trigger('click'); } }); }); </script> } </code></pre><p 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 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;"><p 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;"><strong style="font-weight: 700;">C# 部分</strong></p><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);">@using Microsoft.AspNetCore.Mvc.Rendering</code> を追加し、<code style="border-radius: 8px; background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255);">SelectList</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;"><code style="border-radius: 8px; background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255);">subjectNames</code> の取得処理を <code style="border-radius: 8px; background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255);">ToList()</code> で確定させ、<code style="border-radius: 8px; background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255);">JsonSerializer</code> で安全に JS 配列化。</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;"><p 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;"><strong style="font-weight: 700;">JavaScript 部分</strong></p><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);">lastIndexOf('.')</code> が <code style="border-radius: 8px; background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255);">-1</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;">SweetAlert2 と jQuery の読み込みを正しい CDN URL に設定。</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></ul></li></ul><p 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;">このまま <code style="border-radius: 8px; background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255);">Create.cshtml</code> に貼り付ければ、ASP.NET Core MVC でコンパイル・実行可能です。</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コードをコピーさせる