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

質問編集履歴

3

該当項目だけ表示

2022/07/27 05:18

投稿

aushijima
aushijima

スコア55

title CHANGED
File without changes
body CHANGED
@@ -2,8 +2,6 @@
2
2
 
3
3
  CakePHPでポップアップ画面へ遷移した後formタグで囲われない理由が分からない
4
4
 
5
- 補足に参考にした親犬画面でのformタグと閉じタグの確認はできました。(ポップアップ画面で遺伝子検査結果を押下する前は今回のIDをつけたGeneticTestAddFormのformタグで表示されているようです。)
6
- 遺伝子検査結果ボタンを押下した後に遷移したページ(検査項目などを選ぶ画面)でformタグに囲まれていない状況です。
7
5
  ### 実現したいこと
8
6
 
9
7
 
@@ -15,98 +13,12 @@
15
13
 
16
14
  ### 該当のソースコード
17
15
 
18
- 参考にたソースで出力されているhtml情報(ポップアップ画面)
16
+ 問題が発生しているhtml情報
19
17
  ```HTML
20
- <!-- 親犬登録ポップアップコンテンツ -->
21
- <div id="father-dog_add_popup" class="mfp-hide popup_content parents-dog-add-popup">
18
+ <div class="mfp-content"><div id="genetic-results-options" class="popup_content genetic-results-add-popup">
22
19
  <div class="popup_content_wrap">
23
20
  <div class="heading">
24
- <p class="title">父犬を登録する</p>
25
- <div class="popup-modal-dismiss">
26
- <a href="#">
27
- <img src="/images/admin/icon_close_black_s.png" alt="閉じる">
28
- </a>
29
- </div>
30
- </div>
31
- <div class="popup_scroll_content">
32
- <form action="/breeder/parents_dog/add" novalidate="novalidate" id="0" class="form_admin parents-dog-add-form" enctype="multipart/form-data" method="post" accept-charset="utf-8"><div style="display:none;"><input type="hidden" name="_method" value="POST"/>
33
- </div>
34
- <div class="breeder_admin">
35
- <table class="form_admin_table">
36
- <tbody>
37
- <tr>
38
- <th>その他の遺伝子検査結果<span class="tag_optional">任意</span></th>
39
- <td class="input_comment">
40
- // ajaxで要素を追加する場所
41
- <table class="dogParentGeneticTest">
42
- </table>
43
- <div class="parents_dog_button_wrap">
44
- <a href="#genetic-results-options" class="js-option-box-modal2 notice_popup-modal button_secondary width_s_fixity">遺伝子検査結果を追加する</a>
45
- <!-- 下は、あくまでデータを送るだけ? -->
46
- <!-- 遺伝子検査結果ポップアップコンテンツ-->
47
- <div id="genetic-results-options" class="mfp-hide popup_content genetic-results-add-popup">
48
- <div class="popup_content_wrap">
49
- <div class="heading">
50
- <p class="title">遺伝子検査結果を登録する</p>
51
- <div class="popup-modal-dismiss">
52
- <a href="#">
53
- <img src="/images/admin/icon_close_black_s.png" alt="閉じる">
54
- </a>
55
- </div>
56
- </div>
57
- <div class="popup_scroll_content">
58
- <form action="/breeder/mypage/dog/add?breeder%2Fmypage%2Fdog%2Fadd=" novalidate="novalidate" id="GeneticTestAddForm" class="form_admin genetic-results-add-form" method="post" accept-charset="utf-8"><div style="display:none;"><input type="hidden" name="_method" value="POST"/></div>
59
- <div style="display:none;">
60
- <input type="hidden" name="_method" value="POST">
61
- </div>
62
- <div class="breeder_admin">
63
- <table class="form_admin_table">
64
- <tbody>
65
- </tbody>
66
- </table>
67
- </div>
68
- </form>
69
- </div>
70
- <!-- ここは遺伝子検査情報を登録するボタンを設置 -->
71
- <div class="select_button">
72
- <div class="bsubmit_button_wrap">
73
- <!-- ボタン名は今回用で変える -->
74
- <button class="add-parents-dog-button button_primary" form="0" type="submit">遺伝子検査結果を追加する</button>
75
- </div>
76
- </div>
77
- </div>
78
- </div>
79
- <!-- $this->Form->input('GeneticTest.dog_breed_id',array('options' => $genetic_test_item,'type' => 'select','id' => 'dogGeneticTest', 'class' => "width_l $dog_color_id_error")); -->
80
- <!-- 元々の犬種セレクトボックスはdnクラスをつけて非表示にする -->
81
- <select name="data[GeneticTest][dog_breed_id]" id="slc_sort2" class="width_l dn">
82
- <option value=""></option>
83
- <option value="1">CL 神経セロイドリポフスチン症(CLN8</option>
84
- </select>
85
- </div>
86
- </td>
87
- </tr>
88
- </tbody>
89
- </table>
90
- </div>
91
- </form>
92
- </div>
93
- <div class="select_button">
94
- <div class="bsubmit_button_wrap">
95
- <button class="add-parents-dog-button button_primary" data-parents="father" form="0" type="submit">父犬の情報を登録する</button>
96
- </div>
97
- </div>
98
- </div>
99
- </div>
100
- ```
101
- 参考にしたソース
102
- ```Cake ctpファイル(ポップアップ画面)
103
- <!-- 親犬登録ポップアップコンテンツ -->
104
- <?php $parent = $is_father ? '父' : '母'; ?>
105
- <?php $parent_eng = $is_father ? 'father' : 'mother'; ?>
106
- <div id="<?= $parent_eng ?>-dog_add_popup" class="mfp-hide popup_content parents-dog-add-popup">
107
- <div class="popup_content_wrap">
108
- <div class="heading">
109
- <p class="title"><?= $parent ?>犬を登録する</p>
21
+ <p class="title">遺伝子検査結果を登録する</p>
110
22
  <div class="popup-modal-dismiss">
111
23
  <a href="#">
112
24
  <img src="/images/admin/icon_close_black_s.png" alt="閉じる">
@@ -114,36 +26,42 @@
114
26
  </div>
115
27
  </div>
116
28
  <div class="popup_scroll_content">
117
- <?=$this->Form->create(
118
- 'ParentsDog',
119
- [
120
- 'type' => 'file',
121
- 'novalidate' => true,
122
- 'id' => $parent_eng + 'AddForm',
123
- 'class' => 'form_admin parents-dog-add-form',
124
- 'inputDefaults' => ['error' => false],
125
- 'url' => ['controller' => 'parents_dogs', 'action' => 'add'],
29
+ <div style="display:none;"><input type="hidden" name="_method" value="POST"></div> <div style="display:none;">
126
- ]);
127
- ?>
128
- <div style="display:none;">
129
30
  <input type="hidden" name="_method" value="POST">
130
31
  </div>
131
32
  <div class="breeder_admin">
132
33
  <table class="form_admin_table">
133
34
  <tbody>
134
- //各formなどの入力項目などが記載されています。
35
+ <tr>
36
+ <th>検査項目</th>
37
+ <td>
38
+ <select name="data[GeneticTest][id]" id="GeneticTest-slc_sort" class="width_l genetic_test_item"><option value="6">DM 変性性脊髄症</option><option value="7">GM1 ガングリオシドーシス</option><option value="8">​EIC 運動誘発性虚脱</option><option value="9">FN 家族性腎症</option><option value="10">PRA 進行性網膜萎縮症(prcd)</option><option value="11">DM 変性性脊髄症</option><option value="12">DM 変性性脊髄症</option><option value="13">HUU 高尿酸尿症</option><option value="14">PRA 進行性網膜委縮症(RPGRIP1)</option><option value="15">DM 変性性脊髄症</option><option value="16">PRA 進行性網膜萎縮症(prcd)</option><option value="17">vWD(vWF1) フォンヴィレブランド病 type1</option><option value="18">DM 変性性脊髄症</option><option value="19">​EIC 運動誘発性虚脱</option><option value="20">FN 家族性腎症</option><option value="21">PRA 進行性網膜萎縮症(prcd)</option><option value="22">DM 変性性脊髄症</option><option value="23">​MH 悪性高熱症</option><option value="24">PRA 進行性網膜萎縮症(CORD1)</option><option value="25">フーコドーシス(FUCA1)</option><option value="26">FN 家族性腎症</option></select>
39
+ </td>
40
+ </tr>
41
+ <tr>
42
+ <th>検査結果</th>
43
+ <td>
44
+ <select name="data[GeneticTest][genetic_test_result]" class="width_l genetic_test_result" id="GeneticTestGeneticTestResult">
45
+ <option value="">検査結果を選択してください</option>
46
+ <option value="0">未検査</option>
47
+ <option value="1">クリア</option>
48
+ <option value="2">キャリア</option>
49
+ <option value="3">アフェクテッド</option>
50
+ </select> <p class="error_text" style="display: none;" data-error-field="dog_color_id"><span class="icon_excl"></span></p>
51
+ </td>
52
+ </tr>
135
53
  </tbody>
136
54
  </table>
137
55
  </div>
138
- <?= $this->Form->end(); ?>
139
- </div>
56
+ </div>
57
+ <!-- ここは遺伝子検査情報を登録するボタンを設置 -->
140
58
  <div class="select_button">
141
59
  <div class="bsubmit_button_wrap">
60
+ <!-- ボタン名は今回用で変える -->
142
- <?= $this->Form->button($parent . '犬の情報を登録する', ['class' => 'add-parents-dog-button button_primary', 'data-parents' => $parent_eng, 'form' => $parent_eng + 'AddForm'])?>
61
+ <button class="add-genetic-result-button button_primary" form="0" type="submit">遺伝子検査結果を追加する</button> </div>
143
- </div>
144
62
  </div>
145
63
  </div>
146
- </div>
64
+ <button title="Close (Esc)" type="button" class="mfp-close">×</button></div></div>
147
65
  ```
148
66
 
149
67
 
@@ -159,6 +77,9 @@
159
77
  <div class="heading">
160
78
  <p class="title">遺伝子検査結果を登録する</p>
161
79
  <div class="popup-modal-dismiss">
80
+ <a href="#">
81
+ <img src="/images/admin/icon_close_black_s.png" alt="閉じる">
82
+ </a>
162
83
  </div>
163
84
  </div>
164
85
  <div class="popup_scroll_content">
@@ -170,30 +91,68 @@
170
91
  'id' => 'GeneticTestAddForm',
171
92
  'class' => 'form_admin genetic-results-add-form',
172
93
  'inputDefaults' => ['error' => false],
173
- 'url' => ['controller' => 'parents_dogs', 'action' => 'add'],
94
+ 'url' => ['controller' => 'parents_dogs', 'action' => 'add'],
174
95
  ]);
175
96
  ?>
97
+ <div style="display:none;">
98
+ <input type="hidden" name="_method" value="POST">
99
+ </div>
176
100
  <div class="breeder_admin">
177
101
  <table class="form_admin_table">
178
102
  <tbody>
103
+ <tr>
104
+ <th>検査項目</th>
105
+ <td>
106
+ <?= $this->Form->input(
107
+ 'GeneticTest.id',
108
+ [
109
+ 'type' => 'select',
110
+ 'id' => 'GeneticTest-slc_sort',
111
+ 'empty' => '検査項目を選択してください',
112
+ 'options' => $genetic_test_item,
113
+ 'class' => 'width_l genetic_test_item',
114
+ ]
115
+ ) ?>
116
+ <p class="error_text" style="display: none;" data-error-field="dog_breed_id"><span class="icon_excl"></span></p>
117
+ </td>
118
+ </tr>
119
+ <tr>
120
+ <th>検査結果</th>
121
+ <td>
122
+ <?= $this->Form->input(
123
+ 'GeneticTest.genetic_test_result',
124
+ [
125
+ 'options' => array('未検査','クリア','キャリア','アフェクテッド'),
126
+ 'type' => 'select',
127
+ // 'id' => $parent_eng . '-dogGeneticResult',
128
+ 'class' => 'width_l genetic_test_result',
129
+ 'empty' => '検査結果を選択してください'
130
+ ]
131
+ ); ?>
132
+ <p class="error_text" style="display: none;" data-error-field="dog_color_id"><span class="icon_excl"></span></p>
133
+ </td>
134
+ </tr>
179
135
  </tbody>
180
136
  </table>
181
137
  </div>
182
138
  <?= $this->Form->end(); ?>
183
139
  </div>
184
140
  <!-- ここは遺伝子検査情報を登録するボタンを設置 -->
141
+ <div class="select_button">
142
+ <div class="bsubmit_button_wrap">
143
+ <!-- ボタン名は今回用で変える -->
144
+ <?= $this->Form->button('遺伝子検査結果を追加する', ['class' => 'add-genetic-result-button button_primary', 'form' => 'GeneticTestAddForm'])?>
145
+ </div>
146
+ </div>
185
147
  </div>
186
148
  </div>
187
149
 
150
+
188
151
  ```
189
152
 
190
153
  ### Cakeのバージョン
191
154
  2系になります。
192
155
 
193
-
194
- タグを認識させる為に他の所で設定などが必要だったりするのでしょうか?
195
- 教えていただけると幸いです。
196
-
197
156
  ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-07-27/8c47abbb-d14c-4f95-aa83-835790d93175.png)
198
157
 
199
158
  ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-07-27/4cfe15af-38e2-43ce-bc3b-8bd57e23f6a5.png)

2

ポップアップ修正

2022/07/27 04:15

投稿

aushijima
aushijima

スコア55

title CHANGED
File without changes
body CHANGED
@@ -153,15 +153,12 @@
153
153
  今回記載したctpファイル(ポップアップ画面)
154
154
 
155
155
  ```Cake
156
- <!-- 遺伝子検査結果ポップアップコンテンツ -->
156
+ <!-- 遺伝子検査結果ポップアップコンテンツ 名前やクラス名は変更する-->
157
157
  <div id="genetic-results-options" class="mfp-hide popup_content genetic-results-add-popup">
158
158
  <div class="popup_content_wrap">
159
159
  <div class="heading">
160
160
  <p class="title">遺伝子検査結果を登録する</p>
161
161
  <div class="popup-modal-dismiss">
162
- <a href="#">
163
- <img src="/images/admin/icon_close_black_s.png" alt="閉じる">
164
- </a>
165
162
  </div>
166
163
  </div>
167
164
  <div class="popup_scroll_content">
@@ -173,9 +170,21 @@
173
170
  'id' => 'GeneticTestAddForm',
174
171
  'class' => 'form_admin genetic-results-add-form',
175
172
  'inputDefaults' => ['error' => false],
176
- 'url' => ['controller' => 'genetic_test', 'action' => 'add'],
173
+ 'url' => ['controller' => 'parents_dogs', 'action' => 'add'],
177
174
  ]);
178
175
  ?>
176
+ <div class="breeder_admin">
177
+ <table class="form_admin_table">
178
+ <tbody>
179
+ </tbody>
180
+ </table>
181
+ </div>
182
+ <?= $this->Form->end(); ?>
183
+ </div>
184
+ <!-- ここは遺伝子検査情報を登録するボタンを設置 -->
185
+ </div>
186
+ </div>
187
+
179
188
  ```
180
189
 
181
190
  ### Cakeのバージョン

1

写真や出力htmlを変更

2022/07/27 02:45

投稿

aushijima
aushijima

スコア55

title CHANGED
@@ -1,1 +1,1 @@
1
- CakePHPをFormタグで囲みたい
1
+ CakePHPをFormタグで囲みたい(修正)
body CHANGED
@@ -2,6 +2,8 @@
2
2
 
3
3
  CakePHPでポップアップ画面へ遷移した後formタグで囲われない理由が分からない
4
4
 
5
+ 補足に参考にした親犬画面でのformタグと閉じタグの確認はできました。(ポップアップ画面で遺伝子検査結果を押下する前は今回のIDをつけたGeneticTestAddFormのformタグで表示されているようです。)
6
+ 遺伝子検査結果ボタンを押下した後に遷移したページ(検査項目などを選ぶ画面)でformタグに囲まれていない状況です。
5
7
  ### 実現したいこと
6
8
 
7
9
 
@@ -13,15 +15,88 @@
13
15
 
14
16
  ### 該当のソースコード
15
17
 
16
- 参考にしたソースで出力されているhtml情報
18
+ 参考にしたソースで出力されているhtml情報(ポップアップ画面)
17
19
  ```HTML
18
- <div class="popup_scroll_content">
19
- <div class="breeder_admin select_button_on">
20
- <!-- 検索フォーム -->
21
- <form action="/breeder/mypage/search_dog" id="dogs-search" class="form_admin      style2" method="post" accept-charset="utf-8">
22
- <div style="display:none;">
23
- <input type="hidden" name="_method" value="POST"/>
24
- </div>
20
+ <!-- 親犬登録ポップアップコンテンツ -->
21
+ <div id="father-dog_add_popup" class="mfp-hide popup_content parents-dog-add-popup">
22
+ <div class="popup_content_wrap">
23
+ <div class="heading">
24
+ <p class="title">父犬を登録する</p>
25
+ <div class="popup-modal-dismiss">
26
+ <a href="#">
27
+ <img src="/images/admin/icon_close_black_s.png" alt="閉じる">
28
+ </a>
29
+ </div>
30
+ </div>
31
+ <div class="popup_scroll_content">
32
+ <form action="/breeder/parents_dog/add" novalidate="novalidate" id="0" class="form_admin parents-dog-add-form" enctype="multipart/form-data" method="post" accept-charset="utf-8"><div style="display:none;"><input type="hidden" name="_method" value="POST"/>
33
+ </div>
34
+ <div class="breeder_admin">
35
+ <table class="form_admin_table">
36
+ <tbody>
37
+ <tr>
38
+ <th>その他の遺伝子検査結果<span class="tag_optional">任意</span></th>
39
+ <td class="input_comment">
40
+ // ajaxで要素を追加する場所
41
+ <table class="dogParentGeneticTest">
42
+ </table>
43
+ <div class="parents_dog_button_wrap">
44
+ <a href="#genetic-results-options" class="js-option-box-modal2 notice_popup-modal button_secondary width_s_fixity">遺伝子検査結果を追加する</a>
45
+ <!-- 下は、あくまでデータを送るだけ? -->
46
+ <!-- 遺伝子検査結果ポップアップコンテンツ-->
47
+ <div id="genetic-results-options" class="mfp-hide popup_content genetic-results-add-popup">
48
+ <div class="popup_content_wrap">
49
+ <div class="heading">
50
+ <p class="title">遺伝子検査結果を登録する</p>
51
+ <div class="popup-modal-dismiss">
52
+ <a href="#">
53
+ <img src="/images/admin/icon_close_black_s.png" alt="閉じる">
54
+ </a>
55
+ </div>
56
+ </div>
57
+ <div class="popup_scroll_content">
58
+ <form action="/breeder/mypage/dog/add?breeder%2Fmypage%2Fdog%2Fadd=" novalidate="novalidate" id="GeneticTestAddForm" class="form_admin genetic-results-add-form" method="post" accept-charset="utf-8"><div style="display:none;"><input type="hidden" name="_method" value="POST"/></div>
59
+ <div style="display:none;">
60
+ <input type="hidden" name="_method" value="POST">
61
+ </div>
62
+ <div class="breeder_admin">
63
+ <table class="form_admin_table">
64
+ <tbody>
65
+ </tbody>
66
+ </table>
67
+ </div>
68
+ </form>
69
+ </div>
70
+ <!-- ここは遺伝子検査情報を登録するボタンを設置 -->
71
+ <div class="select_button">
72
+ <div class="bsubmit_button_wrap">
73
+ <!-- ボタン名は今回用で変える -->
74
+ <button class="add-parents-dog-button button_primary" form="0" type="submit">遺伝子検査結果を追加する</button>
75
+ </div>
76
+ </div>
77
+ </div>
78
+ </div>
79
+ <!-- $this->Form->input('GeneticTest.dog_breed_id',array('options' => $genetic_test_item,'type' => 'select','id' => 'dogGeneticTest', 'class' => "width_l $dog_color_id_error")); -->
80
+ <!-- 元々の犬種セレクトボックスはdnクラスをつけて非表示にする -->
81
+ <select name="data[GeneticTest][dog_breed_id]" id="slc_sort2" class="width_l dn">
82
+ <option value=""></option>
83
+ <option value="1">CL 神経セロイドリポフスチン症(CLN8</option>
84
+ </select>
85
+ </div>
86
+ </td>
87
+ </tr>
88
+ </tbody>
89
+ </table>
90
+ </div>
91
+ </form>
92
+ </div>
93
+ <div class="select_button">
94
+ <div class="bsubmit_button_wrap">
95
+ <button class="add-parents-dog-button button_primary" data-parents="father" form="0" type="submit">父犬の情報を登録する</button>
96
+ </div>
97
+ </div>
98
+ </div>
99
+ </div>
25
100
  ```
26
101
  参考にしたソース
27
102
  ```Cake ctpファイル(ポップアップ画面)
@@ -110,3 +185,8 @@
110
185
  タグを認識させる為に他の所で設定などが必要だったりするのでしょうか?
111
186
  教えていただけると幸いです。
112
187
 
188
+ ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-07-27/8c47abbb-d14c-4f95-aa83-835790d93175.png)
189
+
190
+ ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-07-27/4cfe15af-38e2-43ce-bc3b-8bd57e23f6a5.png)
191
+
192
+ ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-07-27/0856af33-d7f1-479d-81aa-6f1129d59f55.png)