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

質問編集履歴

3

質問のアップデート

2018/10/24 13:05

投稿

shino-shino
shino-shino

スコア13

title CHANGED
File without changes
body CHANGED
@@ -58,4 +58,11 @@
58
58
  coffeeScirptとhamlを触るのが初めてで、jqueryも不慣れなため記法が独特過ぎて
59
59
  混乱しているのですが、DOM、もしくはスクリプトをどう修正すればバインドされるでしょうか。
60
60
 
61
+ 特にわからないのが、下記のように記載しているにも関わらずスクロールイベント発生時にしかこの処理が呼ばれないことです。画面表示時に呼ばれるようにするにはどうしたら良いでしょうか。
62
+
63
+ ```
64
+ $('#user_lists_body').on 'ready scroll',
65
+ ```
66
+
67
+
61
68
  よろしくお願い致します。

2

コードの足りない部分を追加

2018/10/24 13:05

投稿

shino-shino
shino-shino

スコア13

title CHANGED
File without changes
body CHANGED
@@ -4,8 +4,26 @@
4
4
  `data` は$ajaxで取得したデータです。
5
5
 
6
6
  ```
7
+ $('#user_lists_body').on 'ready scroll', (e) ->
8
+ scrollTop = $(this).scrollTop()
9
+ bottom = $(this).get(0).scrollHeight - $(this).get(0).offsetHeight
10
+ offset = $('#user_lists').children().length
11
+
12
+ if loadUserList == 1 && bottom - scrollTop < 600
13
+ loadUserList = 0
14
+ $.ajax
15
+ url: '/line_users/user_list.json',
16
+ type: "GET",
17
+ datatype: 'json'
18
+ data: {'offset': offset}
19
+ success: (data, status) ->
20
+ loadUserList = 1
21
+ if(data.length == 0)
22
+ loadUserList = 0
23
+
7
24
  for row in data
8
- template = $('#user_list_template > a').clone()
25
+ template = $('#user_list_template > a').clone()
26
+ alert(row['user'])
9
27
  template.attr('id', 'people-' + row['user']['id'])
10
28
  template.data('user_id', row['user']['id'])
11
29
  template.find('li').addClass('people-' + row['user']['id'])

1

質問内容とサンプルソースの修正

2018/10/24 12:51

投稿

shino-shino
shino-shino

スコア13

title CHANGED
File without changes
body CHANGED
@@ -1,13 +1,11 @@
1
1
  ### 前提・実現したいこと
2
2
 
3
- Rails4, CoffeeScriptで記載されたソースコードの意味を知たいです。
3
+ Rails4, CoffeeScriptで記載された下記のソースがあす。
4
- 作業途中引き継いだソスについて、以下のようなコードがあります。
4
+ `data` は$ajax取得したデタです。
5
5
 
6
-
7
6
  ```
8
7
  for row in data
9
8
  template = $('#user_list_template > a').clone()
10
- alert(template)
11
9
  template.attr('id', 'people-' + row['user']['id'])
12
10
  template.data('user_id', row['user']['id'])
13
11
  template.find('li').addClass('people-' + row['user']['id'])
@@ -19,8 +17,27 @@
19
17
  $('#user_lists').append(template)
20
18
  ```
21
19
 
20
+ dataの内容ををバインドしたいのですが下記のようなDOMを書いてもバインドされません。
21
+
22
+ ```
23
+ %section
24
+ %div
25
+ %div#user_lists_body.user_list_scroll
26
+ %div#user_lists
22
- `data` は$ajaxで取得したデータです。
27
+ %dev#user_list_template
28
+ %a
29
+ %ul
30
+ %li
31
+ %span.name
32
+ %span.time
33
+ %span.preview
34
+ %input{type: "text"}
35
+
36
+ ```
37
+
38
+
39
+
23
40
  coffeeScirptとhamlを触るのが初めてで、jqueryも不慣れなため記法が独特過ぎて
24
- 混乱しているのですが、以下のソースはどういうDOM操作をしようとしていか解説していただけないでしょうか。
41
+ 混乱しているのですが、DOM、もしくスクリプトをどう修正すればバインドされるでしょうか。
25
42
 
26
43
  よろしくお願い致します。