質問するログイン新規登録

回答編集履歴

1

調整

2023/06/20 03:05

投稿

yambejp
yambejp

スコア117967

answer CHANGED
@@ -1,1 +1,36 @@
1
- 遷移せずにAPI経由でXHR(ajax/fetch)で処理して結果を受けてアラートをだせばよいのでは?
1
+ 遷移せずにAPI経由でXHR(ajax/fetch)で処理して結果を受けてアラートをだせばよいのでは?
2
+ # 参考
3
+ ```javascript
4
+ <script>
5
+ document.addEventListener('click',({target})=>{
6
+ if(target.matches('#btn')){
7
+ dlg_input.showModal();
8
+ }
9
+ });
10
+ document.addEventListener('close',({target})=>{
11
+ if(target.matches('#dlg_input')){
12
+ if(dlg_input.returnValue=="送信"){
13
+ fetch(api).then(res=>res.text()).then(data=>{
14
+ if(data=="success"){
15
+ dlg_del.showModal();
16
+ }
17
+ });
18
+ }
19
+ }
20
+ },true);
21
+ </script>
22
+ <dialog id="dlg_input">
23
+ <form method="dialog">
24
+ <input name="id" value="123">
25
+ <input type="submit" value="送信">
26
+ <input type="submit" value="キャンセル">
27
+ </form>
28
+ </dialog>
29
+ <dialog id="dlg_del">
30
+ <form method="dialog">
31
+ 削除しました
32
+ <input type="submit" value="OK">
33
+ </form>
34
+ </dialog>
35
+ <input type="button" value="modal" id="btn">
36
+ ````