teratail
回答率
85.30%
teratail header banner
teratail header banner
質問するログイン新規登録
トップに関する質問外部json読み込みテーブルのtr行と対応する値の取得と反映ができない

編集履歴

質問編集履歴

9

編集

2020/09/25 10:26

投稿

Miii
Miii

スコア30

title CHANGED
File without changes
body CHANGED
@@ -288,7 +288,7 @@
288
288
 
289
289
  //[確定]ボタン
290
290
  $(document).on("click", '#btn4444', function(){
291
- window.changeValue=5;
291
+ window.changeValue=4;
292
292
 
293
293
  gassanFnc();
294
294
  });
@@ -311,11 +311,10 @@
311
311
  window.changeValue = 1;
312
312
  }else{
313
313
  //4列目をよむ
314
- $("#subresult3").text(TableSelect($('table'), 4, window.line+1));
315
314
  window.Calc1=TableSelect($('table'), window.changeValue, window.line+1);
315
+ $("#subresult3").text(window.Calc1);
316
+ $("#gassan").text(window.Calc1);
316
317
 
317
- $("#gassan").text(parseFloat(window.Calc1));
318
-
319
318
  //console.log(window.changeValue);
320
319
  //console.log(window.line);
321
320
  console.log(window.Calc1);

8

編集

2020/09/25 10:26

投稿

Miii
Miii

スコア30

title CHANGED
File without changes
body CHANGED
@@ -300,7 +300,7 @@
300
300
  //let q = `tr:nth-of-type(${y}) td:nth-of-type(${x})`;
301
301
  let q = `table tr:nth-of-type(${y}) td:nth-of-type(${x})`;
302
302
 
303
- return parseFloat($('table').find($(q)).text());
303
+ return $('table').find($(q)).text();
304
304
  //return table.querySelector (q).textContent;
305
305
  }
306
306
  if(window.line==undefined){

7

編集

2020/09/25 10:20

投稿

Miii
Miii

スコア30

title CHANGED
File without changes
body CHANGED
@@ -250,7 +250,6 @@
250
250
  '<th><input type="radio" name="hoge" class="hoge" value="1" /></th>'+
251
251
  '<td class="label">' + this.dt1 + '</td>' +
252
252
  '<td><label style="display:none;">'+this.dt1+this.dt2+'</label>'+ this.dt2 + '</td>' +
253
-
254
253
  '<td>'+this.ps1 + '</td>' +
255
254
  '<td>'+ this.ps2 + '</td>'+
256
255
  '</tr>').appendTo('table.tbl tbody');
@@ -284,13 +283,13 @@
284
283
  $(document).on("change", 'input[type="radio"]', function(){
285
284
  //選択したvalue値を変数に格納
286
285
  window.line = $(this).parents('tr').index();
287
- console.log("radio change");
288
286
  });
289
287
 
290
288
 
291
289
  //[確定]ボタン
292
290
  $(document).on("click", '#btn4444', function(){
293
291
  window.changeValue=5;
292
+
294
293
  gassanFnc();
295
294
  });
296
295
 
@@ -298,9 +297,10 @@
298
297
  //合算処理function
299
298
  function gassanFnc() {
300
299
  function TableSelect (table, x = 1, y = 1) {
300
+ //let q = `tr:nth-of-type(${y}) td:nth-of-type(${x})`;
301
- let q = `tr:nth-of-type(${y}) td:nth-of-type(${x})`;
301
+ let q = `table tr:nth-of-type(${y}) td:nth-of-type(${x})`;
302
- //console.log($(q).find('table').textContent)
302
+
303
- return $('table').find($(q)).textContent
303
+ return parseFloat($('table').find($(q)).text());
304
304
  //return table.querySelector (q).textContent;
305
305
  }
306
306
  if(window.line==undefined){
@@ -313,8 +313,9 @@
313
313
  //4列目をよむ
314
314
  $("#subresult3").text(TableSelect($('table'), 4, window.line+1));
315
315
  window.Calc1=TableSelect($('table'), window.changeValue, window.line+1);
316
- $("#gassan").innerHTML=parseFloat(window.Calc1);
317
316
 
317
+ $("#gassan").text(parseFloat(window.Calc1));
318
+
318
319
  //console.log(window.changeValue);
319
320
  //console.log(window.line);
320
321
  console.log(window.Calc1);

6

表示

2020/09/25 10:19

投稿

Miii
Miii

スコア30

title CHANGED
File without changes
body CHANGED
@@ -12,17 +12,14 @@
12
12
  どこに問題があるのでしょうか？
13
13
 
14
14
  （例）
15
- -------------------------
16
15
  データ１　データAA　データBB
17
16
  あああ　　あああ　　あああ
18
- -------------------------
19
17
  上のように表示されるのが正解として、
20
- -------------------------
18
+
21
19
  データ１　データAA　データBB
22
20
  あああ　　あああ　　あああ
23
21
  データ１　データAA　データBB
24
22
  あああ　　あああ　　あああ
25
- -------------------------
26
23
  と２回同じデータが出力されます。
27
24
 
28
25
  【補足】

5

編集

2020/09/25 09:08

投稿

Miii
Miii

スコア30

title CHANGED
File without changes
body CHANGED
@@ -160,8 +160,8 @@
160
160
  <td></td>
161
161
  </tr>
162
162
  </tbody>
163
- </table>
163
+ </table>
164
- </table>
164
+
165
165
 
166
166
 
167
167
  <p><a id="modal-close2" class="closestyle">[閉じる]</a></p><br>
@@ -287,7 +287,7 @@
287
287
  $(document).on("change", 'input[type="radio"]', function(){
288
288
  //選択したvalue値を変数に格納
289
289
  window.line = $(this).parents('tr').index();
290
- console.log(window.line);
290
+ console.log("radio change");
291
291
  });
292
292
 
293
293
 
@@ -299,10 +299,11 @@
299
299
 
300
300
 
301
301
  //合算処理function
302
- function gassanFnc() {
302
+ function gassanFnc() {
303
303
  function TableSelect (table, x = 1, y = 1) {
304
304
  let q = `tr:nth-of-type(${y}) td:nth-of-type(${x})`;
305
+ //console.log($(q).find('table').textContent)
305
- return $('q').find('table')
306
+ return $('table').find($(q)).textContent
306
307
  //return table.querySelector (q).textContent;
307
308
  }
308
309
  if(window.line==undefined){
@@ -313,9 +314,14 @@
313
314
  window.changeValue = 1;
314
315
  }else{
315
316
  //4列目をよむ
316
- $("#subresult3").text(TableSelect($('table'), 4, window.line+1));
317
+ $("#subresult3").text(TableSelect($('table'), 4, window.line+1));
317
318
  window.Calc1=TableSelect($('table'), window.changeValue, window.line+1);
318
319
  $("#gassan").innerHTML=parseFloat(window.Calc1);
320
+
321
+ //console.log(window.changeValue);
322
+ //console.log(window.line);
323
+ console.log(window.Calc1);
324
+
319
325
  }
320
326
  }
321
327
  }

4

データがうまく反映されない

2020/09/25 08:51

投稿

Miii
Miii

スコア30

title CHANGED
File without changes
body CHANGED
@@ -7,12 +7,31 @@
7
7
  おそらくinput[type="radio]のchangeが効いていないようです。
8
8
  どのように組むと、反映されるようになりますか。
9
9
 
10
+ 追記：
11
+ テーブルに同じデータが2回書き込まれているのですが、
12
+ どこに問題があるのでしょうか？
13
+
14
+ （例）
15
+ -------------------------
16
+ データ１　データAA　データBB
17
+ あああ　　あああ　　あああ
18
+ -------------------------
19
+ 上のように表示されるのが正解として、
20
+ -------------------------
21
+ データ１　データAA　データBB
22
+ あああ　　あああ　　あああ
23
+ データ１　データAA　データBB
24
+ あああ　　あああ　　あああ
25
+ -------------------------
26
+ と２回同じデータが出力されます。
27
+
10
28
  【補足】
11
29
  金額は、
12
30
  行：ラジオボタンの選択行
13
31
  列：４列目
14
32
  を読むようにしております
15
33
 
34
+
16
35
  ```html
17
36
  <!DOCTYPE html>
18
37
  <html>

3

jquery置換

2020/09/25 07:45

投稿

Miii
Miii

スコア30

title CHANGED
File without changes
body CHANGED
@@ -273,7 +273,7 @@
273
273
 
274
274
 
275
275
  //[確定]ボタン
276
- $("#btn4444").on("click",function(){
276
+ $(document).on("click", '#btn4444', function(){
277
277
  window.changeValue=5;
278
278
  gassanFnc();
279
279
  });
@@ -281,11 +281,10 @@
281
281
 
282
282
  //合算処理function
283
283
  function gassanFnc() {
284
- //$("#subresult1").text(window.line);
285
- //選択
286
284
  function TableSelect (table, x = 1, y = 1) {
287
- let q = `tr:nth-of-type(${y}) td:nth-of-type(${x})`;
285
+ let q = `tr:nth-of-type(${y}) td:nth-of-type(${x})`;
286
+ return $('q').find('table')
288
- return table.querySelector (q).textContent;
287
+ //return table.querySelector (q).textContent;
289
288
  }
290
289
  if(window.line==undefined){
291
290
  }else{

2

jquery置換

2020/09/25 07:35

投稿

Miii
Miii

スコア30

title CHANGED
File without changes
body CHANGED
@@ -233,7 +233,8 @@
233
233
  $('<tr>'+
234
234
  '<th><input type="radio" name="hoge" class="hoge" value="1" /></th>'+
235
235
  '<td class="label">' + this.dt1 + '</td>' +
236
- '<td>'+this.dt2 + '</td>' +
236
+ '<td><label style="display:none;">'+this.dt1+this.dt2+'</label>'+ this.dt2 + '</td>' +
237
+
237
238
  '<td>'+this.ps1 + '</td>' +
238
239
  '<td>'+ this.ps2 + '</td>'+
239
240
  '</tr>').appendTo('table.tbl tbody');
@@ -264,14 +265,15 @@
264
265
  });
265
266
 
266
267
 
267
- $('input[type="radio"]').change(function() {
268
+ $(document).on("change", 'input[type="radio"]', function(){
268
- //選択したvalue値を変数に格納
269
+ //選択したvalue値を変数に格納
269
270
  window.line = $(this).parents('tr').index();
270
271
  console.log(window.line);
271
272
  });
272
273
 
274
+
273
275
  //[確定]ボタン
274
- document.querySelector("#btn4444").addEventListener("click", ()=>{
276
+ $("#btn4444").on("click",function(){
275
277
  window.changeValue=5;
276
278
  gassanFnc();
277
279
  });
@@ -293,9 +295,9 @@
293
295
  window.changeValue = 1;
294
296
  }else{
295
297
  //4列目をよむ
296
- $("#subresult3").text(TableSelect(document.querySelector('table'), 4, window.line+1));
298
+ $("#subresult3").text(TableSelect($('table'), 4, window.line+1));
297
- window.Calc1=TableSelect(document.querySelector('table'), window.changeValue, window.line+1);
299
+ window.Calc1=TableSelect($('table'), window.changeValue, window.line+1);
298
- document.querySelector("#gassan").innerHTML=parseFloat(window.Calc1);
300
+ $("#gassan").innerHTML=parseFloat(window.Calc1);
299
301
  }
300
302
  }
301
303
  }

1

余分な表記を消去

2020/09/25 07:26

投稿

Miii
Miii

スコア30

title CHANGED
File without changes
body CHANGED
@@ -324,5 +324,4 @@
324
324
 
325
325
 
326
326
  ]}
327
- コード
328
327
  ```