質問編集履歴
5
コードタグが抜けてしまい、見づらいので修正しました。
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -141,6 +141,7 @@
|
|
|
141
141
|
ご指摘いただいた箇所の修正とうまくいっていない部分の修正を加えました。
|
|
142
142
|
宜しくお願いします。
|
|
143
143
|
遷移元修正
|
|
144
|
+
```html
|
|
144
145
|
<!DOCTYPE html>
|
|
145
146
|
<html>
|
|
146
147
|
<head>
|
4
動的に変動したgetパラメータの部分をeachで繰り返しとして修正しました
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -1,6 +1,9 @@
|
|
|
1
|
-
```ここに言語を入力
|
|
2
|
-
コード
|
|
3
1
|
```### 前提・実現したいこと
|
|
2
|
+
2019/09/29修正追記
|
|
3
|
+
ご指摘いただいたことをもとに、繰り返し部分に修正を加えました。
|
|
4
|
+
ローカルにhtmlファイル（jQuery/javascriptもhtml上に記述）を置き、chrome上で実行させてみました。
|
|
5
|
+
実行結果は、入力フォームが増えない状況です。
|
|
6
|
+
最新の修正内容は元のコードの下に記述しました。
|
|
4
7
|
|
|
5
8
|
htmlの入力フォームをjavascriptのrepeterを使って動的に付け加えることができるようしたいと考えています。
|
|
6
9
|
フォームの追加した中身をgetパラメータに動的に追加できるようにして、getパラメータを受け取る側でも表示を動的に変えられるようにしたいと考えておりますがうまくいきません。
|
|
@@ -132,59 +135,118 @@
|
|
|
132
135
|
|
|
133
136
|
});
|
|
134
137
|
```
|
|
135
|
-
forで対応しようと考えておりますがうまくいかず行き詰まっています。
|
|
136
|
-
宜しくお願いします。
|
|
137
138
|
|
|
138
|
-
2019/09/
|
|
139
|
+
2019/09/29修正
|
|
139
140
|
変更点（getパラメータ取得側 javasscript jQuery側）
|
|
140
141
|
ご指摘いただいた箇所の修正とうまくいっていない部分の修正を加えました。
|
|
141
142
|
宜しくお願いします。
|
|
143
|
+
遷移元修正
|
|
144
|
+
<!DOCTYPE html>
|
|
145
|
+
<html>
|
|
146
|
+
<head>
|
|
147
|
+
<meta charset="utf-8">
|
|
148
|
+
<meta name="description" content="入力フォーム付加">
|
|
149
|
+
<title>入力フォーム付加</title>
|
|
150
|
+
</head>
|
|
151
|
+
<body>
|
|
152
|
+
<h1>入力フォーム付加</h1>
|
|
153
|
+
|
|
154
|
+
<form action="mtest.html" class="repeater">
|
|
155
|
+
<div data-repeater-list="group-a">
|
|
156
|
+
<div data-repeater-item>
|
|
157
|
+
<input type="text" name="fname" value="家族名" id=ritem/>
|
|
158
|
+
<input type="text" name="ninzu" value="人数"/>
|
|
159
|
+
<input data-repeater-delete type="button" value="削除"/>
|
|
160
|
+
</div>
|
|
161
|
+
</div>
|
|
162
|
+
<input data-repeater-create type="button" value="入力フォーム追加"/>
|
|
163
|
+
</form>
|
|
164
|
+
|
|
165
|
+
</body>
|
|
166
|
+
```
|
|
142
167
|
```javascript
|
|
143
|
-
|
|
168
|
+
/*repeaterを使い、入力フォームを追加*/
|
|
144
|
-
var andlng
|
|
145
|
-
//変更点ここまで
|
|
146
|
-
|
|
169
|
+
$(document).ready(function () {
|
|
147
|
-
var vars = [],
|
|
148
|
-
hash;
|
|
149
|
-
|
|
170
|
+
'use strict';
|
|
150
|
-
var hashes = location.search.slice(1).split('&');
|
|
151
|
-
|
|
171
|
+
$('.repeater').repeater({
|
|
152
|
-
|
|
172
|
+
defaultValues: {
|
|
153
|
-
//追加点ここまで
|
|
154
|
-
for (var i = 0; i < hashes.length; i++) {
|
|
155
|
-
|
|
173
|
+
'fname': '家族名',
|
|
156
|
-
vars.push(hash[0]);
|
|
157
|
-
|
|
174
|
+
'ninzu': '人数',
|
|
158
|
-
|
|
175
|
+
}
|
|
159
|
-
return vars;
|
|
160
|
-
|
|
176
|
+
});
|
|
177
|
+
});
|
|
161
178
|
|
|
162
|
-
|
|
179
|
+
/*以下getパラメータを作成しアドレスに付加*/
|
|
163
|
-
|
|
180
|
+
function send() {
|
|
181
|
+
var fname="";
|
|
182
|
+
var ninzu="";
|
|
183
|
+
|
|
184
|
+
/*入力フォームを動的に増減させた場合に対応してURLに付加するgetパラメータを配列を使い変数pramに格納*/
|
|
185
|
+
//一旦配列に格納
|
|
186
|
+
var arr= new Array();
|
|
187
|
+
|
|
188
|
+
$('#group-a ritem').each(function(i){
|
|
189
|
+
if (document.form1['group-a[i][fname]'].value!=""){
|
|
190
|
+
fname=encodeURIComponent(document.form1['group-a[i][fname]'].value);
|
|
191
|
+
}
|
|
192
|
+
|
|
193
|
+
if (document.form1['group-a[i][ninzu]'].value!=""){
|
|
194
|
+
ninzu=encodeURIComponent(document.form1['group-a[i][ninzu]'].value);
|
|
195
|
+
}
|
|
196
|
+
text = $(this).text();
|
|
197
|
+
arr.push(text);
|
|
198
|
+
});
|
|
199
|
+
|
|
200
|
+
/* arrに格納した要素を変数paramに文字列としてつなげる*/
|
|
201
|
+
var pram = "";
|
|
164
|
-
|
|
202
|
+
for(var j=0;j<arr.length;j++){
|
|
165
|
-
|
|
203
|
+
if((j+1)%2 == 1){
|
|
166
|
-
$("div").append("家族名:<span class="name"></span><br>");
|
|
167
|
-
|
|
204
|
+
pram = "fname=" +arr[j] + "&";
|
|
205
|
+
}else{
|
|
206
|
+
//最後の要素であるかどうか判定し、最後であれば＆はつけない
|
|
207
|
+
if((j+1)!=arr.length){
|
|
208
|
+
pram = "ninzu" + arr[j] + "&";
|
|
168
209
|
}else{
|
|
169
|
-
$("div").append("人数:<span class="ninzu"></span><br>");
|
|
170
|
-
|
|
210
|
+
pram = "ninzu" + arr[j];
|
|
171
211
|
}
|
|
172
|
-
|
|
212
|
+
}
|
|
173
|
-
|
|
213
|
+
}
|
|
174
214
|
|
|
215
|
+
location.href="/module/include/js/location4/sample2.html?"+pram;
|
|
216
|
+
return false;
|
|
217
|
+
}
|
|
218
|
+
```
|
|
219
|
+
遷移後修正※htmlについては変更なし
|
|
220
|
+
```javascript
|
|
221
|
+
function getUrlVars() {
|
|
222
|
+
var vars = [],
|
|
223
|
+
hash;
|
|
224
|
+
var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
|
|
225
|
+
for (var i = 0; i < hashes.length; i++) {
|
|
226
|
+
hash = hashes[i].split('=');
|
|
227
|
+
vars.push(hash[0]);
|
|
228
|
+
vars[hash[0]] = hash[1];
|
|
229
|
+
}
|
|
230
|
+
return vars;
|
|
231
|
+
}
|
|
232
|
+
/*以下2019/09/29修正 繰り返し部分家族名と人数を交互に配列arrに格納して、半角カンマで区切り、文字列text3にcsvとして格納*/
|
|
233
|
+
$(function () {
|
|
234
|
+
var queryString = getUrlVars();
|
|
175
235
|
|
|
176
|
-
※についても
|
|
177
|
-
まだうまく組み入れられません。
|
|
178
|
-
// ↓
|
|
179
|
-
/*getパラメータ取得側のvar text = [queryString.fname, queryString.ninzu].join(',');でfnameとninzuを繰り返し処理により配列arrに格納させるコードの追加*/
|
|
180
|
-
var arr
|
|
236
|
+
var arr= new Array();
|
|
181
|
-
|
|
237
|
+
var text1 = "";
|
|
238
|
+
var text2 = "";
|
|
239
|
+
var text3 = "";
|
|
182
|
-
|
|
240
|
+
$('#group-a ritem').each(function(j){
|
|
241
|
+
if((j+1)%2==1){
|
|
183
|
-
|
|
242
|
+
text1 = $('.seni .fname').text(queryString.fname[j]);
|
|
184
|
-
|
|
243
|
+
arr.push(text1);
|
|
244
|
+
}else{
|
|
245
|
+
text2 = $('.seni .ninzu').text(queryString.ninzu[j]);
|
|
246
|
+
arr.push(text2);
|
|
247
|
+
}
|
|
248
|
+
text3 = [arr.fname[j]].join(',');
|
|
185
|
-
|
|
249
|
+
});
|
|
186
|
-
|
|
250
|
+
/*修正ここまで*/
|
|
187
251
|
```
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
よろしく
|
|
252
|
+
よろしくご高覧いただきご回答お願いします。
|
3
繰り返し処理の追加
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -1,4 +1,6 @@
|
|
|
1
|
+
```ここに言語を入力
|
|
2
|
+
コード
|
|
1
|
-
### 前提・実現したいこと
|
|
3
|
+
```### 前提・実現したいこと
|
|
2
4
|
|
|
3
5
|
htmlの入力フォームをjavascriptのrepeterを使って動的に付け加えることができるようしたいと考えています。
|
|
4
6
|
フォームの追加した中身をgetパラメータに動的に追加できるようにして、getパラメータを受け取る側でも表示を動的に変えられるようにしたいと考えておりますがうまくいきません。
|
|
@@ -137,7 +139,7 @@
|
|
|
137
139
|
変更点（getパラメータ取得側 javasscript jQuery側）
|
|
138
140
|
ご指摘いただいた箇所の修正とうまくいっていない部分の修正を加えました。
|
|
139
141
|
宜しくお願いします。
|
|
140
|
-
|
|
142
|
+
```javascript
|
|
141
143
|
//変更点（繰り返しのリミット）
|
|
142
144
|
var andlng
|
|
143
145
|
//変更点ここまで
|
|
@@ -171,10 +173,10 @@
|
|
|
171
173
|
});
|
|
172
174
|
|
|
173
175
|
|
|
174
|
-
※
|
|
176
|
+
※についても
|
|
175
177
|
まだうまく組み入れられません。
|
|
176
|
-
↓
|
|
177
|
-
|
|
178
|
+
// ↓
|
|
179
|
+
/*getパラメータ取得側のvar text = [queryString.fname, queryString.ninzu].join(',');でfnameとninzuを繰り返し処理により配列arrに格納させるコードの追加*/
|
|
178
180
|
var arr = [];
|
|
179
181
|
$(function(){
|
|
180
182
|
$('#seni').each(function(){
|
|
@@ -182,5 +184,7 @@
|
|
|
182
184
|
arr.push(text);
|
|
183
185
|
});
|
|
184
186
|
});
|
|
187
|
+
```
|
|
185
188
|
|
|
189
|
+
|
|
186
190
|
よろしく御回答お願いします。
|
2
遷移元のうまくいっていない部分と遷移先のうまくいっていない部分の再修正を行いました
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -6,10 +6,9 @@
|
|
|
6
6
|
具体的には変数に新たに付け加える形を繰り返すことで、実現したいと考えております。
|
|
7
7
|
|
|
8
8
|
|
|
9
|
-
```
|
|
10
|
-
エラーメッセージ
|
|
11
|
-
```
|
|
12
9
|
|
|
10
|
+
|
|
11
|
+
|
|
13
12
|
### 該当のソースコード
|
|
14
13
|
以下入力フォーム追加とgetパラメータ作成
|
|
15
14
|
```HTML
|
|
@@ -62,11 +61,18 @@
|
|
|
62
61
|
if (document.form1.ninzu.value!=""){
|
|
63
62
|
name=escape(document.form1.ninzu.value);
|
|
64
63
|
}
|
|
65
|
-
/* うまくいかない部分（パラメータにセット）*/
|
|
64
|
+
/* うまくいかない部分（パラメータにセット）2019/09/26修正*/
|
|
65
|
+
for(var i=0;i<arr.length;i++){
|
|
66
|
+
if((i+1)%2 == 1){
|
|
67
|
+
var param = "fname=" +arr[i]+"&";
|
|
68
|
+
}else{
|
|
69
|
+
param = "col4" + arr[i] + "&";
|
|
70
|
+
}
|
|
71
|
+
}
|
|
66
72
|
for(var i=0;i< ; i++){
|
|
67
73
|
var pram="&fname="+fname+"&ninzu="+ninzu;
|
|
68
74
|
}
|
|
69
|
-
|
|
75
|
+
|
|
70
76
|
location.href="/module/include/js/location4/sample2.html?"+pram;
|
|
71
77
|
return false;
|
|
72
78
|
}
|
|
@@ -105,12 +111,21 @@
|
|
|
105
111
|
$(function () {
|
|
106
112
|
var queryString = getUrlVars();
|
|
107
113
|
|
|
108
|
-
// うまくいっていない部分（値を設定）
|
|
114
|
+
// うまくいっていない部分（値を設定）2019/09/26修正
|
|
109
115
|
for(var j=0 ; j< ;j++){
|
|
110
116
|
$('.seni .fname').text(queryString.fname[j]);
|
|
111
117
|
$('.seni .ninzu').text(queryString.ninzu[j]);
|
|
112
118
|
|
|
113
|
-
var text = [queryString.fname[j+1], queryString.ninzu[j+1]].join();
|
|
119
|
+
//var text = [queryString.fname[j+1], queryString.ninzu[j+1]].join();
|
|
120
|
+
//2019/09/26修正
|
|
121
|
+
var arr = [];
|
|
122
|
+
$(function(){
|
|
123
|
+
$('#seni').each(function(){
|
|
124
|
+
text = $(this).text() + (i + 1);
|
|
125
|
+
arr.push(text);
|
|
126
|
+
});
|
|
127
|
+
});
|
|
128
|
+
|
|
114
129
|
}
|
|
115
130
|
|
|
116
131
|
});
|
|
@@ -158,5 +173,14 @@
|
|
|
158
173
|
|
|
159
174
|
※var text = [queryString.fname, queryString.ninzu].join();についても
|
|
160
175
|
まだうまく組み入れられません。
|
|
176
|
+
↓
|
|
177
|
+
2019/09/26修正しました
|
|
178
|
+
var arr = [];
|
|
179
|
+
$(function(){
|
|
180
|
+
$('#seni').each(function(){
|
|
181
|
+
text = $(this).text() + (i + 1);
|
|
182
|
+
arr.push(text);
|
|
183
|
+
});
|
|
184
|
+
});
|
|
161
185
|
|
|
162
186
|
よろしく御回答お願いします。
|
1
ご指摘いただいた箇所と、前回うまくいっていない部分としたところの修正部分をあげました。宜しくお願いします。
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -116,4 +116,47 @@
|
|
|
116
116
|
});
|
|
117
117
|
```
|
|
118
118
|
forで対応しようと考えておりますがうまくいかず行き詰まっています。
|
|
119
|
-
宜しくお願いします。
|
|
119
|
+
宜しくお願いします。
|
|
120
|
+
|
|
121
|
+
2019/09/25
|
|
122
|
+
変更点（getパラメータ取得側 javasscript jQuery側）
|
|
123
|
+
ご指摘いただいた箇所の修正とうまくいっていない部分の修正を加えました。
|
|
124
|
+
宜しくお願いします。
|
|
125
|
+
|
|
126
|
+
//変更点（繰り返しのリミット）
|
|
127
|
+
var andlng
|
|
128
|
+
//変更点ここまで
|
|
129
|
+
function getUrlVars() {
|
|
130
|
+
var vars = [],
|
|
131
|
+
hash;
|
|
132
|
+
//ご指摘いただいたところ
|
|
133
|
+
var hashes = location.search.slice(1).split('&');
|
|
134
|
+
//追加点（&マークの個数+1が表示させる要素の数）
|
|
135
|
+
andlng = hashes.length + 1;
|
|
136
|
+
//追加点ここまで
|
|
137
|
+
for (var i = 0; i < hashes.length; i++) {
|
|
138
|
+
hash = hashes[i].split('=');
|
|
139
|
+
vars.push(hash[0]);
|
|
140
|
+
vars[hash[0]] = decodeURIComponent(hash[1]);
|
|
141
|
+
}
|
|
142
|
+
return vars;
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
//うまくいっていない部分の修正
|
|
146
|
+
$(function(){
|
|
147
|
+
for(var l=1;l<andlng; l++){
|
|
148
|
+
if(l%2 == 1){
|
|
149
|
+
$("div").append("家族名:<span class="name"></span><br>");
|
|
150
|
+
$('.seni .fname').text(queryString.name);
|
|
151
|
+
}else{
|
|
152
|
+
$("div").append("人数:<span class="ninzu"></span><br>");
|
|
153
|
+
$('.seni .ninzu').text(queryString.ninzu);
|
|
154
|
+
}
|
|
155
|
+
}
|
|
156
|
+
});
|
|
157
|
+
|
|
158
|
+
|
|
159
|
+
※var text = [queryString.fname, queryString.ninzu].join();についても
|
|
160
|
+
まだうまく組み入れられません。
|
|
161
|
+
|
|
162
|
+
よろしく御回答お願いします。
|