vpn 장비 쇼핑몰 이라할때
vpn 상품등록을 DB에 아래와 같이 한후
속도 : 10|20|30
ip갯수 : 10~20/20~30|15|25
기간:가격 : 6:1000-12:2000/6:2000-12:3000|6:3000-12:4000|6:5000-12:6000
split 규칙을 이용하여
다차원 배열로 카테고리 값들을 설정 한 후
jquery의 셀렉터 등을 이용하여 동적으로 셀렉트 값들을 변경한다
<?
# 작성자 : 박병훈 <argethero@naver.com>
include "../../include/pubTop.php";
#상품정보
$q = "select * from goods where idx = $pCode";
$res = mysql_query($q);
$pData = mysql_fetch_array($res);
#배열변수
$ipNums = array();
$price_periods = array();
#스크립트 배열변수에 현재 제품에 관한 모든 정보를 넣어놓는다
echo "<script>";
echo "var ipNums = new Array();\n";
echo "var prices = new Array();\n";
#속도
$speedArr = explode("|",$pData[speed]);
#ip갯수
$ipNumArr = explode("|",$pData[ipNum]);
#기간,금액
$priceArr = explode("|",$pData[price_period]);
#속도의 종류만큼 하위 카테고리 분할 [간만에 머리좀 쓰자. 3차원 배열 ㅡ,.ㅡ]
for($i = 0 ; $i < sizeof($speedArr); $i++) {
$ipNumArr2 = explode("/",$ipNumArr[$i]);
$priceArr2 = explode("/",$priceArr[$i]);
echo "\t ipNums[$i] = new Array();\n";
echo "\t prices[$i] = new Array();\n";
for($j = 0 ;$j < sizeof($ipNumArr2); $j++) {
echo "\t\t ipNums[$i][$j] = '$ipNumArr2[$j]';\n";
echo "\t\t prices[$i][$j] = new Array();\n";
$priceArr3 = explode("-",$priceArr2[$j]);
for($k = 0; $k < sizeof($priceArr3) ; $k ++) {
echo "\t\t\t prices[$i][$j][$k] = '$priceArr3[$k]';\n";
}
}
}
echo "</script>\n";
//echo "<pre>";
//print_r($ipNums);
?>
<script>
function set_category(obj) {
$("#ipNum option").remove();
$("#ipNum").append("<option value=''>IP 개수</option>");
flag = obj.value.split("_");
n = flag[1];
for(i = 0 ; i < ipNums[n].length; i++) {
//alert(ipNums[n][i]);
$("#ipNum").append("<option value='"+ipNums[n][i]+"_"+n+"_"+i+"'>"+ipNums[n][i]+"개</option>");
}
}
function set_category2(obj) {
$("#price_period option").remove();
$("#price_period").append("<option value=''>기간</option>");
flag = obj.value.split("_");
n = flag[1];
n2 = flag[2];
for(j = 0 ; j < prices[n][n2].length ; j++) {
period = prices[n][n2][j].split(":");
period = period[0];
$("#price_period").append("<option value='"+prices[n][n2][j]+"'>"+period+"개월</option>");
}
}
function set_price(obj) {
price = obj.value.split(":");
alert(price[1]);
$("#showPrice").html(price[1]);
$("#showPrice").addClass("sum");
}
</script>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="/images/sub_title.gif"></td>
</tr>
<tr>
<td background="/images/sub_bg.gif">
<!--세부페이지-->
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td>
<table width="595" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td colspan="4"><img src="image/product_title.gif"></td>
</tr>
<tr>
<td height="20" colspan="4"></td>
</tr>
<tr>
<td><img src="<?=$pData[product_imgPath]?>"></td>
<td width="15"></td>
<td width="230">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="40"><img src="image/pd_info_list_name.gif"></td>
<td width="20"> </td>
<td class="Pname"><?=$pData[name]?></td>
</tr>
<tr>
<td><img src="image/pd_info_list_cpname.gif"></td>
<td> </td>
<td class="Cname"><?=$pData[com_name]?></td>
</tr>
<tr>
<td><img src="image/pd_info_list_select1.gif"></td>
<td> </td>
<td>
<select name="speed" id="speed" style="width:150;" class="Dbtxt1" onchange="set_category(this);">
<option value="">속도선택</option>
<? for($i = 0 ; $i < sizeof($speedArr); $i++) { ?>
<option value="<?=$speedArr[$i]?>_<?=$i?>"><?=$speedArr[$i]?>Mbps</option>
<? } ?>
</select>
</td>
</tr>
<tr>
<td><img src="image/pd_info_list_select2.gif"></td>
<td> </td>
<td>
<select name="ipNum" id="ipNum" style="width:150;" class="Dbtxt1" onchange="set_category2(this);">
<option value="">IP 개수</option>
</select>
</td>
</tr>
<tr>
<td><img src="image/pd_info_list_select3.gif"></td>
<td> </td>
<td>
<select name="price_period" id="price_period" style="width:150;" class="Dbtxt1" onchange="set_price(this)">
<option value="">기간</option>
</select>
</td>
</tr>
<tr>
<td><img src="image/pd_info_list_sum.gif"></td>
<td> </td>
<td><div id="showPrice">옵션을 선택해 주세요</div></td>
</tr>
<tr>
<td colspan="3" height="45" align="center"><a href="#" onFocus="this.blur()"><img src="/images/btn_apply.gif" border="0"></a></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="40"></td>
</tr>
<tr>
<td><img src="image/pd_info_title_01.gif"></td>
</tr>
<tr>
<td><? include_once $DOCUMENT_ROOT."$pData[product_detailPage]"; ?></td>
</tr>
</table>
<!--세부페이지 끝-->
</td>
</tr>
</table>
<? include "../../include/pubBottom.php"; ?>
'Web > javascript' 카테고리의 다른 글
google javascript hosting (0) | 2011.12.01 |
---|---|
퀵메뉴 소스 (0) | 2010.05.12 |
메모리 누수 방지 (0) | 2010.04.07 |
[스크립트] [ 1원팁 ] prototype.js & jQuery 같이 Load 사용하기 (0) | 2010.03.25 |
정규식으로 폼값 validation (0) | 2010.03.23 |