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

質問編集履歴

2

Controllerについて、期待する処理結果、実際の処理結果の追記。

2021/06/19 17:06

投稿

退会済みユーザー
title CHANGED
File without changes
body CHANGED
@@ -66,7 +66,7 @@
66
66
  }else{
67
67
  var checked = confirm("発送を取り消しますか?");
68
68
  if (checked == true) {
69
- alert("削除しました");
69
+ alert("取り消しました");
70
70
  return true;
71
71
  } else {
72
72
  alert("キャンセルしました");
@@ -77,16 +77,42 @@
77
77
  }
78
78
  ```
79
79
 
80
- ### テーブルの中身
80
+ ### Controllerとテーブルの中身
81
81
  fluitという配列に、以下のように果物の情報が3つずつ入っていたとします。
82
82
  (html内にて、発送状況が1なら取り消し済み、0なら発送中と表示)
83
+
84
+ Controllerでは選択された行の発送状況が0だった場合は1にする処理を書いています。
85
+ 一方で発送状況が1だった場合は何も処理を行わないようにしています。
86
+
83
87
  |ラジオボタン|果物の名前|値段|発送状況|
84
88
  |:--|:--:|--:|
85
89
  |ラジオボタン|りんご|100|0|
86
90
  |ラジオボタン|ぶどう|120|0|
87
91
  |ラジオボタン|もも|200|1|
88
92
 
93
+ ### 期待する処理結果
94
+ ・ラジオボタンを何も選択しなかった場合
95
+ →初期は非表示にしている「ラジオボタンを選択してください。」というメッセージを表示。処理はされない。
89
96
 
97
+ ・ももの行のラジオボタンを選択後に発送取り消しボタンを押下した場合
98
+ →初期は非表示にしている「【発送中】を選択してください。」というメッセージを表示。処理はされない。
99
+
100
+ ・リンゴの行のラジオボタンを選択後に発送取り消しボタンを押下した場合
101
+ →「発送を取り消しますか」というダイアログの後、その選択肢によって「取り消しました。」「キャンセルしました。」というダイアログを表示し、Controllerで処理を行う。処理後は「取り消し済み」という表記に変更。
102
+
103
+ ### 実際の処理結果
104
+ ・ラジオボタンを何も選択しなかった場合
105
+ →初期は非表示にしている「ラジオボタンを選択してください。」というメッセージを表示。
106
+
107
+ ・ももの行のラジオボタンを選択後に発送取り消しボタンを押下した場合
108
+ →メッセージもダイアログも表示されず何も変化しない。
109
+
110
+ ・リンゴの行のラジオボタンを選択後に発送取り消しボタンを押下した場合
111
+ →ダイアログがないままControllerに処理が送られ、「発送状況」の値が0から1に変更される。そのためビューでも「取り消し済み」という表記に変更。
112
+
113
+ おそらく、ラジオボタンの入力チェックはできていますが、選択された行の発送状況を区別できていないため、発送中でも取り消し済みでも処理が送られているようです。
114
+
115
+
90
116
  ### 以上を踏まえての質問内容
91
117
  3つ目のラジオボタン(もも)を選択しボタンを押下したときに、選択された行の発送状況が「発送中」であるか「取り消し済み」であるかを取得し、if文にて「「取り消し済み」だった場合」という条件を書くにはどのようにしたらよいですか?
92
118
  また、使用すif文に記載する条件は
@@ -97,6 +123,8 @@
97
123
 
98
124
  とすればよいのかも教えていただきたいです。
99
125
 
126
+ 今回、Controllerでメッセージ表記する方法でもよいのですが、ダイアログを使用する処理もあるため、できればJavascriptにて値を取得してメッセージの表記をしたいです。
127
+
100
128
  再度の掲載、また編集になり、ご迷惑をおかけし申し訳ございません。
101
129
  また拙い文章と理解度での質問になってしまっていること、重ねてお詫び申し上げます。
102
130
  お力添えをお願いします。

1

実現したいこと、HTML、Javascript、テーブル、質問内容。大きく変わっていない部分もありますが、それらの編集をさせていただきました。ご迷惑をおかけし申し訳ございません。

2021/06/19 17:06

投稿

退会済みユーザー
title CHANGED
File without changes
body CHANGED
@@ -3,30 +3,43 @@
3
3
  HTML内のテーブルに設置したラジオボタンが選択されたときに、選択されたラジオボタンと同じ行にあるtdの値を取得するやり方がわかりません。
4
4
  やりたいことは、JavaScriptにてラジオボタンを選択しボタンを押下後、選択された行と同じ行にある値を取得し、その内容によってエラーメッセージの表示・非表示を行いたいです。
5
5
 
6
+ <追記>
7
+ 下記コードにて具体例を説明させていただきます。
8
+ htmlで作成したテーブルの3番目、もものラジオボタンを選択後に「発送取り消しボタン」を押下した場合、ももはすでに「取り消し済み」になっているため、初期段階では非表示にしている「【発送中】を選択してください。」というエラーメッセージを表示したいです。
9
+ そのため、Javascriptにてラジオボタンで選択された行の「発送状況」の値を取得し、該当のif文内に「発送状況が「取り消し済み」だったら」という条件を記載したいです。
6
10
 
7
11
  ### 該当のソースコード
8
12
 
9
13
  ```HTML
10
14
  <table>
11
- <tr>
15
+ <tr>
12
- <th>ラジオボタン</th>
16
+ <th>ラジオボタン</th>
13
- <th>果物の名前</th>
17
+ <th>果物の名前</th>
14
- <th>値段</th>
18
+ <th>値段</th>
15
- <th>地域</th>
19
+ <th>発送状況</th>
16
- </tr>
20
+ </tr>
17
21
 
18
- <tr th:each="fluit:${session.fluits}">
22
+ <tr th:each="fluit:${session.fluits}">
19
- <td><input type="radio" name="fluitRadio" th:value="${fluit.fluitId}" /></td>
23
+ <td><input type="radio" name="fluitRadio" th:value="${fluit.fluitId}" /></td>
20
- <td th:text="${fluit.name)}"></td>
24
+ <td th:text="${fluit.name)}"></td>
21
- <td th:text="${fluit.fee}"></td>
25
+ <td th:text="${fluit.fee}"></td>
22
- <td th:text="${fluit.area}"></td>
26
+ <td th:text="${fluit.stock} == 1?[取り消し済み]:[発送中]"></td>
23
- </tr>
27
+ </tr>
24
- </table>
28
+ </table>
29
+ <!-- ▼▼▼▼▼▼▼発送削除ボタン▼▼▼▼▼▼▼ -->
30
+              <!-- ラジオボタン未選択の場合はエラーメッセージ表示 -->
31
+ <div id="selectradio">ラジオボタンを選択してください。</div>
32
+ <!-- 取り消し済みを選択した場合はエラーメッセージ表示 -->
33
+ <div id="gonow">【発送中】を選択してください。</div>
34
+
25
- <input onclick="return MoveCheck()" type="submit" name="submitfluit"
35
+ <input onclick="return MoveCheck()" type="submit" name="reset"
26
- id="checkButton" value="発送削除" />
36
+ id="checkButton" value="発送取り消し" />
27
37
  ```
28
38
  ```Javascript
29
39
  function MoveCheck() {
40
+ //エラーメッセージを初期段階で未表示にする
41
+ document.getElementById("selectradio").style.display ="none";
42
+ document.getElementById("gonow").style.display ="none";
30
43
  var flag = 0;
31
44
  //入力チェック
32
45
  if (document.form1.fluitRadio.length) {
@@ -44,11 +57,12 @@
44
57
  }
45
58
 
46
59
  if (flag) {
60
+ //ラジオボタン未選択の場合の処理
47
61
  selectradio.style.display =""; //「ラジオボタンを選択してください」を表示
48
62
  return false; // 送信を中止
49
63
  } else {
50
- if(”【ここに選択されたラジオボタンと同じ行にあるfluit.areaが「北海道」だった場合を書きたいです】”){
64
+ if(”【ここに選択されたラジオボタンと同じ行にあるfluit.areaが「取り消し済み」だった場合を書きたいです】”){
51
- fluitnow.style.display ="";//「【北海道以外】のものを選択してください」を表示
65
+ gonow.style.display ="";//「【発送済み】のものを選択してください」を表示
52
66
  }else{
53
67
  var checked = confirm("発送を取り消しますか?");
54
68
  if (checked == true) {
@@ -65,17 +79,24 @@
65
79
 
66
80
  ### テーブルの中身
67
81
  fluitという配列に、以下のように果物の情報が3つずつ入っていたとします。
82
+ (html内にて、発送状況が1なら取り消し済み、0なら発送中と表示)
68
- |ラジオボタン|果物の名前|値段|地域|
83
+ |ラジオボタン|果物の名前|値段|発送状況|
69
84
  |:--|:--:|--:|
70
- |ラジオボタン|りんご|100|関東|
85
+ |ラジオボタン|りんご|100|0|
71
- |ラジオボタン|ぶどう|120|関西|
86
+ |ラジオボタン|ぶどう|120|0|
72
- |ラジオボタン|もも|200|北海道|
87
+ |ラジオボタン|もも|200|1|
73
88
 
89
+
74
90
  ### 以上を踏まえての質問内容
75
- 3つ目のラジオボタン(もも)を選択しボタンを押下したときに、「北海道」というJavaScriptで取得するにはどのようにしたらよいですか?
91
+ 3つ目のラジオボタン(もも)を選択しボタンを押下したときに、選択された行の発送状況が発送中であるか「取り消し済み」であるかを取得し、if文にて「「取り消し済み」だった場合」という条件書くにはどのようにしたらよいですか?
92
+ また、使用すif文に記載する条件は
76
- また、先述致しましたが、最終的には条件によってエラーメッセージを表示したいです。値を取得後は値が条件に合うのかif文を書きたいと思っています。Javascriptにて該当箇所を記述
93
+ if( 変数(選択された行の発送状況) == 1
94
+
95
+ となるのか、
77
- 場合、 値=="北海道" で等価演算子はあっていますか?
96
+ if( 変数(選択された行発送状況) == "取り消し済み"){
97
+
78
- (改め、最終的にやりたこと→ラジオボタンを選択しボタンを押下しに、選択されラジオボタンと同じ行にあるfluit.areaが「北海道」だった場合はエラーメッセージを表示したいです。
98
+ とすればよいのかも教えていたきたいです。
79
99
 
100
+ 再度の掲載、また編集になり、ご迷惑をおかけし申し訳ございません。
80
- 拙い文章と理解度での質問になってしまい申し訳ございせん
101
+ また拙い文章と理解度での質問になってしまってること、重ねてお詫び申し上げ
81
102
  お力添えをお願いします。