回答編集履歴

2

JSON

2018/07/13 09:49

投稿

yambejp
yambejp

スコア114583

test CHANGED
@@ -181,3 +181,69 @@
181
181
  </form>
182
182
 
183
183
  ```
184
+
185
+
186
+
187
+ # JSONパースした場合
188
+
189
+ とくに違いは見えませんが・・
190
+
191
+
192
+
193
+ ```javascript
194
+
195
+ $(function(){
196
+
197
+ var a=JSON.parse(`{
198
+
199
+ "test":[
200
+
201
+ {"id": 1,"type":"aaa","color":"red"},
202
+
203
+ {"id": 2,"type":"aaa","color":"blue"},
204
+
205
+ {"id": 3,"type":"bbb","color":"blue"},
206
+
207
+ {"id": 4,"type":"ccc","color":"blue"},
208
+
209
+ {"id": 5,"type":"ccc","color":"green"}
210
+
211
+ ]
212
+
213
+ }`);
214
+
215
+ console.log(a); // とりあえず確認
216
+
217
+ var b={};
218
+
219
+ $('#form').on('submit',function(e){
220
+
221
+ e.preventDefault();
222
+
223
+ var vals_type=$(this).find('[name="type[]"]:checked').map(function(x){
224
+
225
+ return $(this).val();
226
+
227
+ });
228
+
229
+ var vals_color=$(this).find('[name="color[]"]:checked').map(function(x){
230
+
231
+ return $(this).val();
232
+
233
+ });
234
+
235
+ b.test=a.test.filter(function(x){
236
+
237
+ return $.inArray(x.type,vals_type)>=0 || $.inArray(x.color,vals_color)>=0;
238
+
239
+ });
240
+
241
+ console.log(a); // 検索後確認
242
+
243
+ console.log(b); // 結果確認
244
+
245
+ });
246
+
247
+ });
248
+
249
+ ```

1

更新

2018/07/13 09:49

投稿

yambejp
yambejp

スコア114583

test CHANGED
@@ -77,3 +77,107 @@
77
77
 
78
78
 
79
79
  ```
80
+
81
+
82
+
83
+ # sample
84
+
85
+
86
+
87
+ ```javascript
88
+
89
+ $(function(){
90
+
91
+ var a={
92
+
93
+ "test":[
94
+
95
+ {"id": 1,"type":"aaa","color":"red"},
96
+
97
+ {"id": 2,"type":"aaa","color":"blue"},
98
+
99
+ {"id": 3,"type":"bbb","color":"blue"},
100
+
101
+ {"id": 4,"type":"ccc","color":"blue"},
102
+
103
+ {"id": 5,"type":"ccc","color":"green"},
104
+
105
+ ],
106
+
107
+ };
108
+
109
+ var b={};
110
+
111
+ $('#form').on('submit',function(e){
112
+
113
+ e.preventDefault();
114
+
115
+ var vals_type=$(this).find('[name="type[]"]:checked').map(function(x){
116
+
117
+ return $(this).val();
118
+
119
+ });
120
+
121
+ var vals_color=$(this).find('[name="color[]"]:checked').map(function(x){
122
+
123
+ return $(this).val();
124
+
125
+ });
126
+
127
+ b.test=a.test.filter(function(x){
128
+
129
+ return $.inArray(x.type,vals_type)>=0 || $.inArray(x.color,vals_color)>=0;
130
+
131
+ });
132
+
133
+ console.log(b);
134
+
135
+ });
136
+
137
+ });
138
+
139
+ ```
140
+
141
+ ```HTML
142
+
143
+ <form id="form">
144
+
145
+ <div class="searchRow methodRow">
146
+
147
+ <p>タイプ</p>
148
+
149
+ <div class="searchContent">
150
+
151
+ <input type="checkbox" id="type01" name="type[]" value="aaa"><label for="type01">aaa</label>
152
+
153
+ <input type="checkbox" id="type02" name="type[]" value="bbb"><label for="type02">bbb</label>
154
+
155
+ <input type="checkbox" id="type02" name="type[]" value="ccc"><label for="type02">ccc</label>
156
+
157
+ </div>
158
+
159
+ </div>
160
+
161
+ <div class="searchRow rateRow">
162
+
163
+ <p>色</p>
164
+
165
+ <div class="searchContent">
166
+
167
+ <input type="checkbox" id="color01" name="color[]" value="red"><label for="color01">赤</label>
168
+
169
+ <input type="checkbox" id="color02" name="color[]" value="blue"><label for="color02">青</label>
170
+
171
+ <input type="checkbox" id="color03" name="color[]" value="green"><label for="color03">緑</label>
172
+
173
+ </div>
174
+
175
+ </div>
176
+
177
+ <button class="submit" value="検索">検索</button>
178
+
179
+ <input type="hidden" name="search_submit" value="1">
180
+
181
+ </form>
182
+
183
+ ```