jQuery 로 2중 카테고리 한번 만들었 봤어요 ^^
허접잖은 실력으로 2중 카테고리 해서 검색 할수 있는거 한번 만들어 봤어요.
제이 쿼리 공부하면서 테스트 삼아 만들어 봤어요 허접해도 이해해 주세요
디비 구조는 불당님이 올려주신 계층구조 방식 사용했어요
http://sir.co.kr/bbs/board.php?bo_table=tip_mysql&wr_id=270
예제 주소 : http://becontacts.com/kr/category_change.php
category_change.php
<script>
$(document).ready(function(){
$("#first").change(function(){
var selected = $("#first option:selected");
var selected = selected.val();
$.ajax({
type: "POST",
url: "./category_change_exec.php",
data: "first=" + selected + "&pr_id=<?=$_GET[pr_id]?>" ,
success: function(msg){
$("#model_view").html(msg);
}
});
})
.change();
$("#search").click(function(){
var first = $("#first > option:selected").val();
var pr_id = $("#pr_id > option:selected").val();
window.location= "category_change.php?first="+ first + "&pr_id=" + pr_id ;
});
});
</script>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<select name="first" id="first" size="1" required itemname='Category'>
<option value="">카테고리</option>
<?
$sql = " select category_id, name, parent, en from g4_category where parent is null order by name ";
$result = sql_query($sql);
while ($row = sql_fetch_array($result))
{
?>
<option value='<?=$row[category_id]?>' <? if($_GET[first]==$row[category_id]){echo "selected";} ?>><?=$row['name']?></option>
<?
}
?>
</select>
</td>
<td id="model_view">
</td>
<td>
<input type="button" name="button" id="search" value="검색" />
</td>
</tr>
</table>
category_change_exec.php
$sql = "
SELECT t2.category_id as category_id, t2.name as category_name, t2.en as en_name
FROM g4_category AS t1
LEFT JOIN g4_category AS t2 ON t2.parent = t1.category_id
WHERE t1.category_id = '$_POST[first]' order by t2.name ;
";
$result = sql_query($sql);
echo "
<select name='pr_id' id='pr_id'>
<option value=''>선택하세요</option>
";
while ($row = sql_fetch_array($result)){
?>
<option value='<?=$row['category_id']?>' <? if($row['category_id'] == $_POST['pr_id']) echo "selected"; ?>><?=$row[category_name]?></option>
<?
}
echo "</select>";
고칠점이나 바꿀점 있으면 조언좀 주세요.
검색하고 나서도 셀렉트 박스 값을 그대로 갖고 있게 했어요.
제이 쿼리 공부하면서 테스트 삼아 만들어 봤어요 허접해도 이해해 주세요
디비 구조는 불당님이 올려주신 계층구조 방식 사용했어요
http://sir.co.kr/bbs/board.php?bo_table=tip_mysql&wr_id=270
예제 주소 : http://becontacts.com/kr/category_change.php
category_change.php
<script>
$(document).ready(function(){
$("#first").change(function(){
var selected = $("#first option:selected");
var selected = selected.val();
$.ajax({
type: "POST",
url: "./category_change_exec.php",
data: "first=" + selected + "&pr_id=<?=$_GET[pr_id]?>" ,
success: function(msg){
$("#model_view").html(msg);
}
});
})
.change();
$("#search").click(function(){
var first = $("#first > option:selected").val();
var pr_id = $("#pr_id > option:selected").val();
window.location= "category_change.php?first="+ first + "&pr_id=" + pr_id ;
});
});
</script>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<select name="first" id="first" size="1" required itemname='Category'>
<option value="">카테고리</option>
<?
$sql = " select category_id, name, parent, en from g4_category where parent is null order by name ";
$result = sql_query($sql);
while ($row = sql_fetch_array($result))
{
?>
<option value='<?=$row[category_id]?>' <? if($_GET[first]==$row[category_id]){echo "selected";} ?>><?=$row['name']?></option>
<?
}
?>
</select>
</td>
<td id="model_view">
</td>
<td>
<input type="button" name="button" id="search" value="검색" />
</td>
</tr>
</table>
category_change_exec.php
$sql = "
SELECT t2.category_id as category_id, t2.name as category_name, t2.en as en_name
FROM g4_category AS t1
LEFT JOIN g4_category AS t2 ON t2.parent = t1.category_id
WHERE t1.category_id = '$_POST[first]' order by t2.name ;
";
$result = sql_query($sql);
echo "
<select name='pr_id' id='pr_id'>
<option value=''>선택하세요</option>
";
while ($row = sql_fetch_array($result)){
?>
<option value='<?=$row['category_id']?>' <? if($row['category_id'] == $_POST['pr_id']) echo "selected"; ?>><?=$row[category_name]?></option>
<?
}
echo "</select>";
고칠점이나 바꿀점 있으면 조언좀 주세요.
검색하고 나서도 셀렉트 박스 값을 그대로 갖고 있게 했어요.
|
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기
댓글 4개
ajax를 이용해서 선택시 새로 로딩하는 방식입니다~
근데 엄청난 대용량 필드가 아닌이상, 오히려 부담갈것 같네요..;
마우스로 안하고 키보드로 하나씩 내리는 분들 있습니다~
10번 내려가면 쿼리 10번임 ㅠㅠ