SkyoceanHome
Home
Privacy
ダウンロード
SkyShop
Updated Information
チュートリアルコード集
References
記事編集
日付
ジャンルのカテゴリ―名
名前を選択して下さい。
Contexts
Controllers
Databases
Htmls
JavaScripts
Models
MVCTutorials
Others
Styles
Views
タイトル
内容の要旨
<p data-bm="53" 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>Bootstrap のモーダルを使わずに、<strong style="font-weight: 700;">SweetAlert2</strong> で「はい/いいえ」形式の確認ダイアログに置き換えるコード例を示します。</p><p data-bm="54" 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;">以下は ASP.NET Core MVC のビュー(Razor)や JavaScript に組み込める、<strong style="font-weight: 700;">完全動作する SweetAlert2 の Yes/No ダイアログ</strong>のサンプルです。</p><h3 data-bm="55" 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; display: inline-block; font: 400 20px / 22px roboto, helvetica, sans-serif; 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. SweetAlert2 の読み込み</h3><p data-bm="56" 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);"><head></code> または <code style="border-radius: 8px; background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255);">_Layout.cshtml</code> に追加します。</p><pre data-priority="2" data-bm="57" 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="68" 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);">Html</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);"><!-- SweetAlert2 CSS & JS --></span> <<span style="color: rgb(34, 134, 58);">link</span> <span style="color: rgb(0, 92, 197);">href</span>=<span style="color: rgb(3, 47, 98);">"https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.min.css"</span> <span style="color: rgb(0, 92, 197);">rel</span>=<span style="color: rgb(3, 47, 98);">"stylesheet"</span>> <<span style="color: rgb(34, 134, 58);">script</span> <span style="color: rgb(0, 92, 197);">src</span>=<span style="color: rgb(3, 47, 98);">"https://cdn.jsdelivr.net/npm/sweetalert2@11"</span>></<span style="color: rgb(34, 134, 58);">script</span>> </code></pre><h3 data-bm="58" 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; display: inline-block; font: 400 20px / 22px roboto, helvetica, sans-serif; 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. JavaScript で Yes/No ダイアログを表示</h3><pre data-priority="2" data-bm="59" 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="69" 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);">Html</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(34, 134, 58);">script</span>> <span style="color: rgb(106, 115, 125);">// 繰越金額入力ダイアログを表示する関数</span> <span style="color: rgb(215, 58, 73);">function</span> <span style="color: rgb(111, 66, 193);">showCarryOverDialog</span>() { <span style="color: rgb(111, 66, 193);">Swal</span>.<span style="color: rgb(111, 66, 193);">fire</span>({ <span style="color: rgb(0, 92, 197);">title</span>: <span style="color: rgb(3, 47, 98);">'お知らせ'</span>, <span style="color: rgb(0, 92, 197);">text</span>: <span style="color: rgb(3, 47, 98);">'「繰越金額」を入力してください。'</span>, <span style="color: rgb(0, 92, 197);">icon</span>: <span style="color: rgb(3, 47, 98);">'question'</span>, <span style="color: rgb(0, 92, 197);">showCancelButton</span>: <span style="color: rgb(0, 92, 197);">true</span>, <span style="color: rgb(106, 115, 125);">// 「いいえ」ボタンを表示</span> <span style="color: rgb(0, 92, 197);">confirmButtonText</span>: <span style="color: rgb(3, 47, 98);">'はい'</span>, <span style="color: rgb(106, 115, 125);">// OKボタンのラベル</span> <span style="color: rgb(0, 92, 197);">cancelButtonText</span>: <span style="color: rgb(3, 47, 98);">'いいえ'</span>, <span style="color: rgb(106, 115, 125);">// キャンセルボタンのラベル</span> <span style="color: rgb(0, 92, 197);">reverseButtons</span>: <span style="color: rgb(0, 92, 197);">true</span>, <span style="color: rgb(106, 115, 125);">// ボタンの並びを逆にする(Yesを右側に)</span> <span style="color: rgb(0, 92, 197);">focusCancel</span>: <span style="color: rgb(0, 92, 197);">true</span> <span style="color: rgb(106, 115, 125);">// デフォルトフォーカスをキャンセルに</span> }).<span style="color: rgb(111, 66, 193);">then</span>((result) => { <span style="color: rgb(215, 58, 73);">if</span> (result.isConfirmed) { <span style="color: rgb(106, 115, 125);">// 「はい」が押された場合の処理</span> <span style="color: rgb(215, 58, 73);">console</span>.<span style="color: rgb(111, 66, 193);">log</span>(<span style="color: rgb(3, 47, 98);">"ユーザーが『はい』を選択しました"</span>); <span style="color: rgb(106, 115, 125);">// 例: サーバーに送信する処理</span> <span style="color: rgb(106, 115, 125);">// sendCarryOverAmount();</span> } <span style="color: rgb(215, 58, 73);">else</span> <span style="color: rgb(215, 58, 73);">if</span> (result.dismiss === <span style="color: rgb(111, 66, 193);">Swal</span>.DismissReason.cancel) { <span style="color: rgb(106, 115, 125);">// 「いいえ」が押された場合の処理</span> <span style="color: rgb(215, 58, 73);">console</span>.<span style="color: rgb(111, 66, 193);">log</span>(<span style="color: rgb(3, 47, 98);">"ユーザーが『いいえ』を選択しました"</span>); } }); } </<span style="color: rgb(34, 134, 58);">script</span>> </code></pre><h3 data-bm="60" 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; display: inline-block; font: 400 20px / 22px roboto, helvetica, sans-serif; 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. 呼び出し例(ボタンから表示)</h3><pre data-priority="2" data-bm="61" 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="70" 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);">Html</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(34, 134, 58);">button</span> <span style="color: rgb(0, 92, 197);">type</span>=<span style="color: rgb(3, 47, 98);">"button"</span> <span style="color: rgb(0, 92, 197);">class</span>=<span style="color: rgb(3, 47, 98);">"btn btn-primary"</span> <span style="color: rgb(0, 92, 197);">onclick</span>=<span style="color: rgb(3, 47, 98);">"showCarryOverDialog()"</span>> 繰越金額入力 </<span style="color: rgb(34, 134, 58);">button</span>> </code></pre><h3 data-bm="62" 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; display: inline-block; font: 400 20px / 22px roboto, helvetica, sans-serif; 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;">補足</h3><ul data-bm="63" 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;">Bootstrap モーダル</strong>は不要になります。SweetAlert2 がモーダル表示を担当します。</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);">icon: 'question'</code> を <code style="border-radius: 8px; background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255);">warning</code> や <code style="border-radius: 8px; background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255);">info</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);">input: 'number'</code> を設定すれば、金額入力も可能です。</li></ul><p data-bm="64" 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;">もし「はい/いいえ」だけでなく、<strong style="font-weight: 700;">金額入力付きの SweetAlert2 ダイアログ</strong>にしたい場合は、次のようにできます。</p><pre data-priority="2" data-bm="65" 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="71" 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);">Javascript</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(111, 66, 193);">Swal</span>.<span style="color: rgb(111, 66, 193);">fire</span>({ <span style="color: rgb(0, 92, 197);">title</span>: <span style="color: rgb(3, 47, 98);">'お知らせ'</span>, <span style="color: rgb(0, 92, 197);">text</span>: <span style="color: rgb(3, 47, 98);">'「繰越金額」を入力してください。'</span>, <span style="color: rgb(0, 92, 197);">input</span>: <span style="color: rgb(3, 47, 98);">'number'</span>, <span style="color: rgb(0, 92, 197);">inputAttributes</span>: { <span style="color: rgb(0, 92, 197);">min</span>: <span style="color: rgb(0, 92, 197);">0</span> }, <span style="color: rgb(0, 92, 197);">showCancelButton</span>: <span style="color: rgb(0, 92, 197);">true</span>, <span style="color: rgb(0, 92, 197);">confirmButtonText</span>: <span style="color: rgb(3, 47, 98);">'OK'</span>, <span style="color: rgb(0, 92, 197);">cancelButtonText</span>: <span style="color: rgb(3, 47, 98);">'キャンセル'</span> }).<span style="color: rgb(111, 66, 193);">then</span>((result) => { <span style="color: rgb(215, 58, 73);">if</span> (result.isConfirmed) { <span style="color: rgb(215, 58, 73);">console</span>.<span style="color: rgb(111, 66, 193);">log</span>(<span style="color: rgb(3, 47, 98);">"入力された金額:"</span>, result.value); } }); </code></pre><p data-bm="66" 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;">✅ この方法なら、Bootstrap のモーダル HTML を削除しても動作しますし、ASP.NET Core MVC の任意のビューに簡単に組み込めます。</p><p data-bm="67" 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;">もしご希望なら、この SweetAlert2 ダイアログから <strong style="font-weight: 700;">直接 Controller に AJAX 送信するコード</strong>も追加できますが、作りますか?<br>そうすれば「はい」クリック後に即サーバー処理が走ります。</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コードをコピーさせる