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

質問編集履歴

4

追記

2018/10/31 02:23

投稿

退会済みユーザー
title CHANGED
File without changes
body CHANGED
@@ -17,7 +17,7 @@
17
17
  users?locale=ja:226 undefined
18
18
  users?locale=ja:227 Uncaught TypeError: $(...).modal is not a function
19
19
  at alert (users?locale=ja:227)
20
- at HTMLDocument.<anonymous> (p_users?locale
20
+ at HTMLDocument.<anonymous> (users?locale
21
21
  というエラーになります
22
22
 
23
23
  $("#modal") はきちんと存在していて $("#modal").modal が存在していないみたいです

3

追記

2018/10/31 02:23

投稿

退会済みユーザー
title CHANGED
File without changes
body CHANGED
@@ -8,14 +8,19 @@
8
8
 
9
9
  body 内の<script></script> や asset/javascript 内で
10
10
  ```
11
+ console.log($("#modal"));
11
- console.log($("modal").modal();
12
+ console.log($("modal").modal);
12
13
  $("#modal").modal();
13
14
  ```
15
+ をかくと
16
+ jQuery.fn.init [div#modal.modal.fade, context: document, selector: "#modal"]
14
- をかくと undefined のあと
17
+ users?locale=ja:226 undefined
15
- $(...).modal is not a function
18
+ users?locale=ja:227 Uncaught TypeError: $(...).modal is not a function
19
+ at alert (users?locale=ja:227)
20
+ at HTMLDocument.<anonymous> (p_users?locale
16
21
  というエラーになります
17
22
 
18
- $("#modal") はきちんと存在してい
23
+ $("#modal") はきちんと存在していて $("#modal").modal が存在していないみたいで
19
24
 
20
25
  chrome の開発ツール ネットワーク JS のログにも
21
26
  bootstrap.min.js

2

追記

2018/10/31 02:22

投稿

退会済みユーザー
title CHANGED
File without changes
body CHANGED
@@ -22,4 +22,83 @@
22
22
  がロードされたログがでていてここまでに他のエラーはでていません
23
23
 
24
24
  他に大量の JS がよみこまれていてわざわざ modal を undefined にするようなものがあるとは考えにくいのですが
25
- 何か考えられる可能性や、原因を調べるにはどこをみればいいか心当たりのある方はいないでしょうか…
25
+ 何か考えられる可能性や、原因を調べるにはどこをみればいいか心当たりのある方はいないでしょうか…
26
+
27
+
28
+ 追記:
29
+
30
+ view は業務内容のためすべてはみせられませんが
31
+ 全ページに対して body の序盤に
32
+ 以下のようなサブビューを呼び出す render 'modal' をおいてます
33
+ <script> 内はデバッグ用に一時的にいれてて動くようになったら assets 内のJSに移す予定です
34
+
35
+ _modal.html.erb
36
+ ```
37
+ <div class="modal fade" id="modal" tabindex="-1">
38
+ <div class="modal-dialog">
39
+ <div class="modal-content">
40
+ <div class="modal-header">
41
+ <button type="button" class="close" data-dismiss="modal"><span>×</span></button>
42
+ <h4 class="modal-title"></h4>
43
+ </div>
44
+ <div class="modal-body">
45
+ </div>
46
+ <div class="modal-footer">
47
+ <button type="button" class="btn btn-default" data-dismiss="modal"><%= t 'common.close' %></button>
48
+ </div>
49
+ </div>
50
+ </div>
51
+ </div>
52
+ <script>
53
+ function alert(msg, title='') {
54
+ $("#modal .modal-body").html(msg);
55
+ $("#modal .modal-title").html(title);
56
+ console.log($("#modal").modal);
57
+ $("#modal").modal();
58
+ }
59
+
60
+ $(function () {
61
+ alert('test');
62
+ });
63
+ </script>
64
+ ```
65
+
66
+ さらにテスト用に下記の様なシステムと同じ bootstrap, jquery のみよみこんだ
67
+ 最小セットのHTMLをかいてブラウザで表示させると modal は動きます
68
+ なので途中によみこまれるJSのどこかでわざわざ undefined で上書きされてるとしか思えないのですが
69
+ 'modal' という単語でリポジトリ内を全検索してもそれらしいコードはみあたりませんでした…
70
+
71
+ ```
72
+ <html>
73
+ <head>
74
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
75
+ <script src="https://code.jquery.com/jquery-2.1.4.min.js" data-turbolinks-eval="false"></script>
76
+ <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js" data-turbolinks-eval="false"></script>
77
+ </head>
78
+ <body>
79
+ <div class="modal fade" id="modal" tabindex="-1">
80
+ <div class="modal-dialog">
81
+ <div class="modal-content">
82
+ <div class="modal-header">
83
+ <button type="button" class="close" data-dismiss="modal"><span>×</span></button>
84
+ <h4 class="modal-title">test</h4>
85
+ </div>
86
+ <div class="modal-body">
87
+ test body
88
+ </div>
89
+ <div class="modal-footer">
90
+ <button type="button" class="btn btn-default" data-dismiss="modal"><%= t 'common.close' %></button>
91
+ </div>
92
+ </div>
93
+ </div>
94
+ </div>
95
+
96
+ <script>
97
+ $(function () {
98
+ $("#modal").modal();
99
+ });
100
+ </script>
101
+ </body>
102
+ </html>
103
+
104
+ ```

1

タグ変更

2018/10/31 02:10

投稿

退会済みユーザー
title CHANGED
File without changes
body CHANGED
File without changes