배열질문입니다..
본문
선택된 체크박스의 벨류 값만 가져오도록 코딩된것을,
혹시 그룹화 할 수 있을까요? ㅠㅠ
<tr>
<th scope="row">도배</th>
<td>
<ul class="btn_area nine_column after">
<li class="btn_li">
<input id="a" type="checkbox" name="aya1" value="소폭합지">
<label for="a">소폭 합지</label>
</li>
<li class="btn_li">
<input id="b" type="checkbox" name="aya1" value="광폭합지">
<label for="b">광폭 합지</label>
</li>
</ul>
</td>
</tr>
<tr>
<th scope="row">목공</th>
<td>
<ul class="btn_area nine_column after">
<li class="btn_li">
<input id="f" type="checkbox" name="aya2" value="몰딩">
<label for="f">몰딩</label>
</li>
<li class="btn_li">
<input id="g" type="checkbox" name="aya2" value="걸레받이">
<label for="g">걸레받이</label>
</li>
</ul>
</td>
</tr>
<div id="btn">버튼</div>
<div id="content"></div>
<script type="text/javascript">
$(function(){
$("#btn").click(function(){
var strs = "";
for (i = 1; i <= 2 ; i ++ ){
f = "aya"+i;
$("input[name="+f+"]:checked").each(function() {
//f += $(this).val()+",";
strs += $(this).val()+"|";
});
}
$("#content").html(strs);
})
})
</script>
위 코드를 실행하면
아래와 같이 나오는데요,,
소폭합지는 도배그룹으로
몰딩은 목공 그룹으로,,, 그룹화 해서 표시 되도록 할 수 있을까요....????????
그게 안된다면,, for문을 풀고 일일히 하는게 맞겠죠?????ㅠㅠ
답변 5
$(function(){
$("#btn").click(function(){
var strs_aya1 =[];
var strs_aya2 =[];
for (i = 1; i <= 2 ; i ++ ){
f = "aya"+i;
$("input[name="+f+"]:checked").each(function() {
if( $(this).attr("name") == "aya1" ) strs_aya1.push($(this).val());
else strs_aya2.push($(this).val());
});
}
$("#content").html("도배=>"+strs_aya1.join("|")+"/목공=>"+strs_aya2.join("|"));
})
})
되네요.. !!!
근데 네임값이 2개가 아니라 9개라서 ㅎㅎㅎ 주신 코드 참고해서 연구해봐야겟네용..
$list[0] = array("도배", "소폭 합지", "광폭 합지");
$list[1] = array("목공", "몰딩", "걸레받이");
for($i=0; $i<count($list); $i++) {
echo "row " . $list[$i][0] . PHP_EOL;
for($j=1; $j<count($list[$i]); $j++) {
echo "li " . $list[$i][$j] . PHP_EOL;
}
}
이렇게 첫번째 값은 row의 name(도배, 목공)으로 하시고
두번째 값부터 하위 값(목공의 경우 소폭 합지, 광폭 합지)로 하시면 되지 않을까 싶네요.
이게 체크된 벨류값이 나와야 하는건데 적용이 될까요?
이전에도 한번 이와 비슷한 질문이 있었던것 같은데..
jquery 를 사용하신다면 아래 코드를 조금 변경해 보시는게 좋을 듯 합니다.
var seq = $('.chkitem:checked').map(function(){ return $(this).val();}).get().join(",");
이건 체크된 것만 배열화 해서 얻어 온것이니 tag의 클래스만 적당히 바꾸어 주시면 될 듯 하고요
closest("th")
를 사용해서 해당 그룹명을 가져오면 될 듯 합니다.
콤마(,) 이거로 배열된느거 같은데,, 배열은 되는데 콤마는 나오지가 않네용..,
그리고 closest("th")이것은 어디다 넣어야 하는걸까요? ㅠㅠ
$("#btn").click(function(){
var item = [], arr = ['', '도배', '목공'], html = '', f, i;
for (i = 1, f = 'aya' + i, item[f] = []; i <= 2 ; i ++ ){
$("input[name="+f+"]:checked").each(function() {
item[f].push( this.value );
});
if (item[f].length)
html += (i == 1 ? '' : '|') + arr[i] + ':' + item[f].join(',');
}
$("#content").html(html);
})
감사합니다..
하지만 아무것도 나오지는 않네용.ㅠㅠ
$("#btn").click(function(){
var item = [], cate = [''], html = '', f, i, name;
$( '.btn_area' ).parent().prev().each( function() {
cate.push( $(this).text() );
});
for (i = 1; i < cate.length ; i ++){
name = 'aya' + i;
item[name] = [];
$("input[name="+name+"]:checked").each(function() {
item[name].push( this.value );
});
if (item[name].length)
html += (html ? '|' : '') + cate[i] + ':' + item[name].join(',');
}
$("#content").html(html);
})
새로주신 코드도 안나오길래 보았더니
th의 텍스트를 못찾더라구요 ㅎㅎ
$( '.btn_area' ).parent().prev().each( function() {
cate.push( $(this).text() );
});
이부분을
$( '.titless' ).each( function() {
cate.push( $(this).text() );
});
이렇게 바꾸고
그래서 th안에 p태그 넣고 클래스로 잡았습니다 ㅎㅎ
감사합니다!!
푸쉬랑 조인 아주 좋은기능 배웟습니다 감사합니다.
우선 놓고 갑니다~
<table>
<tr>
<th scope="row">도배</th>
<td>
<ul class="btn_area nine_column after">
<li class="btn_li">
<input id="a" class="chkitem" type="checkbox" name="aya1" value="소폭합지">
<label for="a">소폭 합지</label>
</li>
<li class="btn_li">
<input id="b" class="chkitem" type="checkbox" name="aya1" value="광폭합지">
<label for="b">광폭 합지</label>
</li>
</ul>
</td>
</tr>
<tr>
<th scope="row">목공</th>
<td>
<ul class="btn_area nine_column after">
<li class="btn_li">
<input id="f" class="chkitem" type="checkbox" name="aya2" value="몰딩">
<label for="f">몰딩</label>
</li>
<li class="btn_li">
<input id="g" class="chkitem" type="checkbox" name="aya2" value="걸레받이">
<label for="g">걸레받이</label>
</li>
</ul>
</td>
</tr>
</table>
<div id="btn"><button id="btn">클릭</button></div>
<div id="content"></div>
<script type="text/javascript">
$(function(){
$("#btn").click(function(){
var arr = {};
var seq = $('.chkitem:checked').each(function(index){
var name = $(this).closest("tr").children().filter(":first").html();
if(!$.isArray(arr[name])) arr[name] = new Array();
arr[name].push($(this).val());
});
})
})
</script>
왜 안나오죠..
보내주신거에 table태그가 빠졌던데요.. js하고 그것만 추가 했습니다.
아 그리고 input에 chkitem 클래스 추가한것이 전부 입니다.
ㅎㅎ 감사합니다.
