質問編集履歴

3

修正内容を追記として記述。

2020/10/05 00:25

投稿

beginner.tanaka
beginner.tanaka

スコア23

test CHANGED
File without changes
test CHANGED
@@ -18,11 +18,77 @@
18
18
 
19
19
 
20
20
 
21
+ ### 該当のソースコード
21
22
 
22
23
 
23
- ### 該当のソースコード
24
24
 
25
+ ```
26
+
27
+ const confirm = () => {
28
+
29
+ const form = document.getElementById("itemConfirm");
30
+
31
+ form.addEventListener("submit", (e) => {
32
+
33
+ e.preventDefault();
34
+
35
+
36
+
37
+ var result = window.confirm('ボタンをクリック!');
38
+
39
+
40
+
41
+ if( result ) {
42
+
43
+ console.log('OKがクリックされました');
44
+
45
+ document.getElementById("itemConfirm").submit();
46
+
47
+ }
48
+
49
+ else {
50
+
51
+ var redirect_url ="/items/new";
52
+
53
+ console.log('キャンセルがクリックされました');
54
+
55
+ let formElements = document.forms.contactForm;
56
+
57
+ formElements.submit.disabled = false;
58
+
59
+ }
60
+
61
+ });
62
+
63
+ };
64
+
65
+ window.addEventListener("load", confirm);
66
+
67
+ ```
68
+
69
+ ### 追記
70
+
71
+ コメントを頂き修正しました。しかし「disabled」が解除されません。
72
+
25
- javascriptファイル実行されるコードです。
73
+ どこが間違っているのでしょうか?よろしくお願いします。
74
+
75
+
76
+
77
+ 追記内容
78
+
79
+ ・document.forms.contactForm; を
80
+
81
+  document.getElementById("itemSubmit");に修正。
82
+
83
+
84
+
85
+ ・formElements.submit.disabled = false; のsubmitを削除
86
+
87
+
88
+
89
+ .erbファイルのform_withのsubmitにidを追加
90
+
91
+ <%= f.submit "出品する" ,class:"sell-btn" , id: "itemSubmit"%>
26
92
 
27
93
 
28
94
 
@@ -56,7 +122,7 @@
56
122
 
57
123
  else {
58
124
 
59
-
125
+ console.log('キャンセルがクリックされました');
60
126
 
61
127
  let formElements = document.getElementById("itemSubmit");
62
128
 
@@ -100,8 +166,6 @@
100
166
 
101
167
  上記の記述で、disabledは解除できると思うのですが、解除できませんでした。
102
168
 
103
- キャンセルを押したら、そのページには留まるのですが、何も入力できない状況です。
104
-
105
169
 
106
170
 
107
171
  よろしくお願いいたします。

2

else内をformElements.submit.disabled = false; から formElements.disabled = false;に変更

2020/10/05 00:25

投稿

beginner.tanaka
beginner.tanaka

スコア23

test CHANGED
File without changes
test CHANGED
@@ -2,15 +2,19 @@
2
2
 
3
3
 
4
4
 
5
+ 練習で商品の出品アプリを作っています。
6
+
5
- ボタンを押すと、javascriptでイベントが発火し、ダイヤログが表示されるようになっています。
7
+ 出品ボタンを押すと、javascriptでイベントが発火し、「OK」か「キャンセル」のダイヤログが表示されるようになっています。
8
+
9
+ OKであれば、トップページに画面繊維。キャンセルであれば、入力した内容が残った状態で、そのページに留まる。
10
+
11
+ というのを実現したいのですが、「キャンセル」を押した際に「disabled」が付与され、何も入力できない状態となっています。
6
12
 
7
13
 
8
14
 
9
- ここで、キャンセル」を押すと、現在のページに留まるようになっているのですが、ここから再度、
15
+ disabledの解除方法教えていただきたいです
10
16
 
11
- ボタンを押そうとしても、「disabled」が解除されていない為、押すことができません。
12
-
13
- この解除の仕方を教えてただきたいです。
17
+ よろしくお願します。
14
18
 
15
19
 
16
20
 
@@ -52,19 +56,13 @@
52
56
 
53
57
  else {
54
58
 
55
- console.log('キャンセルがクリックされました');
59
+
56
60
 
57
- let formElements = document.forms.contactForm;
61
+ let formElements = document.getElementById("itemSubmit");
58
62
 
59
- formElements.submit.disabled = false;
63
+ formElements.disabled = false;
60
-
61
-
62
64
 
63
65
  }
64
-
65
-
66
-
67
-
68
66
 
69
67
  });
70
68
 
@@ -86,7 +84,15 @@
86
84
 
87
85
 
88
86
 
89
- <%= form_with(model: @item, id: 'itemConfirm', html:{name: "contactForm"},local: true) do |f| %>
87
+ <%= form_with model: @item, id: 'itemConfirm',local: true do |f| %>
88
+
89
+
90
+
91
+ //入力欄省略
92
+
93
+
94
+
95
+ <%= f.submit "出品する" ,class:"sell-btn" , id: "itemSubmit"%>
90
96
 
91
97
  ```
92
98
 
@@ -94,10 +100,8 @@
94
100
 
95
101
  上記の記述で、disabledは解除できると思うのですが、解除できませんでした。
96
102
 
97
- よろくお願いいます。
103
+ キャンセルを押したら、そのページには留るのでが、何も入力できない状況です
98
104
 
99
105
 
100
106
 
101
- 画像追加
107
+ よろしくお願いいたします。
102
-
103
- ![イメージ説明](78d9d9a271f473432f3231830a95229c.png)

1

画像追加

2020/10/04 23:54

投稿

beginner.tanaka
beginner.tanaka

スコア23

test CHANGED
File without changes
test CHANGED
@@ -95,3 +95,9 @@
95
95
  上記の記述で、disabledは解除できると思うのですが、解除できませんでした。
96
96
 
97
97
  よろしくお願いいたします。
98
+
99
+
100
+
101
+ 画像追加
102
+
103
+ ![イメージ説明](78d9d9a271f473432f3231830a95229c.png)