상품리스트 페이지에 상품별 카운트다운 넣기
본문
참고해서 쇼핑몰에 남은 시간 표시를 적용했습니다
위 링크에서 알려주신 소스를 item.form.skin.php 파일에 추가 했고요
/adm/shop_admin/itemform.php 쇼핑몰 상품관리 페이지에서
<input type="text" name="it_1" value="<?php echo $it['it_1']; ?>"
id="it_1" class="frm_input" size="40">년
.
.
.
.
이런식으로 여분필드를 활용해서 년도, 시간 분등을 지정한후에
item.form.skin.php 에다가 종료시간을 여분필드에 적용했습니다
<?
// 종료시간 - Ex) 3월 24일 오후 2시
$endtime = mktime("$it[it_4];","$it[it_5];","00","$it[it_2];","$it[it_3];", "$it[it_1];") ; // 예: "시", "분", "초", "월" , "일", "년도"
그래서 상세 페이지에선 작동이 잘되는것으로 확인이 되었는데요
문제는 상품 리스트 또는 메인 화면의 인기상품등의 최신글 에도 불러오게 할수 있는 방법을 모르겠씁니다
똑같은 방법으로 하려고 했지만
list.10.skin.php 에 적용해 보니
<!-- 상품진열 10 시작 { -->
<div class="sct_wrap" >
<?php
.
.
.
if($i == 0) echo "<p class=\"sct_noitem\">등록된 상품이 없습니다.</p>\n";
?>
사이에 스크립트 추가만 하면 화면에서 먹통이 되어 버립니다
-- 원본소스--
<!-- 남은 시간 { -->
<script src="<?php echo G5_JS_URL; ?>/jquery.plugin.js"></script>
<script src="<?php echo G5_JS_URL; ?>/jquery.countdown.js"></script>
<!-- } 남은 시간 -->
<?
// 종료시간 - Ex) 3월 24일 오후 2시
$endtime = mktime('14','00','00','03','24','2014') ;
// 판매 가능하고 재고가 있으며 품절이 아닐때, 종료시간 전일때
if ( $it[it_use] && !$it[it_soldout] && $it[it_stock_qty] > 0 && $endtime>time()) ) {
// 남은 시간
$countdown = $endtime - time();
//echo $countdown;
?>
<div class="buy_time">
<!-- 마감 카운트다운 -->
<div class="time">
<span class="tit">남은 시간</span>
<div id="dealCountdown" class="count" style="background:none;"></div>
</div>
<script type="text/javascript">
$(document).ready(function() {
var d = <?php echo $countdown; ?>;
var layout ='<span class="date"><span>{dn}</span><span class="hide">일</span></span>';
layout +='<div>';
layout +=' <span>{hnn}</span>';
layout +=' <span class="hide">시간</span>';
layout +='</div>';
layout +='<div>';
layout +=' <span>{mnn}</span>';
layout +=' <span class="hide">분</span>';
layout +='</div>';
layout +='<div>';
layout +=' <span>{snn}</span>';
layout +=' <span class="hide">초</span>';
layout +='</div>';
$('#dealCountdown').countdown({until: d, format: 'dHMS', labels:['','','','','','',''],layout:layout});
});
</script>
</div>
<? } ?>
문제가 된 list.10.skin.php 소스
<?php
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
// add_stylesheet('css 구문', 출력순서); 숫자가 작을 수록 먼저 출력됨
add_stylesheet('<link rel="stylesheet" href="'.G5_SHOP_CSS_URL.'/style.css">', 0);
add_javascript('<script src="'.G5_THEME_JS_URL.'/jquery.shop.list.js"></script>', 10);
?>
<?php if($config['cf_kakao_js_apikey']) { ?>
<script src="https://developers.kakao.com/sdk/js/kakao.min.js"></script>
<script src="<?php echo G5_JS_URL; ?>/kakaolink.js"></script>
<script>
// 사용할 앱의 Javascript 키를 설정해 주세요.
Kakao.init("<?php echo $config['cf_kakao_js_apikey']; ?>");
</script>
<script src="/js/jquery.plugin.js"></script>
<script src="/js/jquery.countdown.js"></script>
<?php } ?>
<div class="sct-size">
<button type="button" class="btn-size" id="btn-big">이미지크게보기</button>
<button type="button" class="btn-size active" id="btn-small">이미지작게보기</button>
</div>
<!-- 상품진열 10 시작 { -->
<div class="sct_wrap" >
<?php
$li_width = intval(100 / $this->list_mod);
$li_width_style = ' style="width:'.$li_width.'%;"';
for ($i=0; $row=sql_fetch_array($result); $i++) {
if ($i == 0) {
if ($this->css) {
echo "<ul id=\"sct_wrap\" class=\"{$this->css}\">\n";
} else {
echo "<ul id=\"sct_wrap\" class=\"sct sct_10\">\n";
}
}
if($i % $this->list_mod == 0)
$li_clear = ' sct_clear';
else
$li_clear = '';
echo "<li class=\"sct_li\"><div class=\"sct_li_wr\">\n";
echo "<div class=\"img_wr\">";
if ($this->href) {
echo "<div class=\"sct_img\"><a href=\"{$this->href}{$row['it_id']}\" class=\"sct_a\">\n";
}
if ($this->view_it_img) {
echo get_it_image($row['it_id'], $this->img_width, $this->img_height, '', '', stripslashes($row['it_name']))."\n";
}
if ($this->href) {
echo "</a></div>\n";
}
echo "<div class=\"sct_btn\">
<div class=\"sct_cart_btn\">
<button type=\"button\" class=\"btn_cart\" data-it_id=\"{$row['it_id']}\"><span class=\"sound_only\">장바구니</span><i class=\"fa fa-shopping-cart\" aria-hidden=\"true\"></i></button>
<button type=\"button\" class=\"btn_wish\" data-it_id=\"{$row['it_id']}\"><span class=\"sound_only\">위시리스트</span><i class=\"fa fa-heart\" aria-hidden=\"true\"></i></button>
</div>
</div>\n";
echo "</div>";
echo "<div class=\"sct_cartop\"></div>\n";
if ($this->href) {
echo "<div class=\"sct_txt\"><a href=\"{$this->href}{$row['it_id']}\" class=\"sct_a\">\n";
}
if ($this->view_it_name) {
echo stripslashes($row['it_name'])."\n";
}
if ($this->href) {
echo "</a></div>\n";
}
if ($this->view_it_price) {
echo "<div class=\"sct_cost\">\n";
echo display_price(get_price($row), $row['it_tel_inq'])."\n";
echo "</div>\n";
}
/* 카운트다운 소스 추가 시작 */
// 종료시간 - Ex) 3월 24일 오후 2시
$endtime = mktime("$it[it_4];","$it[it_5];","00","$it[it_2];","$it[it_3];", "$it[it_1];") ; // 예: "시", "분", "초", "월" , "일", "년도"
// 남은 시간
$countdown = $endtime - time();
//echo $countdown;
echo "
<div class='buy_time'>
<div class='time'>
<div id='dealCountdown' class='count' style='background:none;'></div>
</div>
</div>
</div>
;"
echo "
<script type='text/javascript'>
$(document).ready(function() {
var d = <?php echo $countdown; ?>;
var layout ='<span class='date'><span>{dn}</span><span class='hide'>일</span></span>';
layout +='<div>';
layout +=' <span>{hnn}</span>';
layout +=' <span class=''>:</span>';
layout +='</div>';
layout +='<div>';
layout +=' <span>{mnn}</span>';
layout +=' <span class=''>:</span>';
layout +='</div>';
layout +='<div>';
layout +=' <span>{snn}</span>';
layout +=' <span class=''></span>';
layout +='</div>';
$('#dealCountdown').countdown({until: d, format: 'dHMS', labels:['','','','','','',''],layout:layout});
});
</script>
;"
/* 카운트다운 소스 추가 끝 */
echo "<div class=\"sct_icon_wr\">".item_icon2($row)."</div>\n";
echo "</div></li>\n";
}
if ($i > 0) echo "</ul>\n";
if($i == 0) echo "<p class=\"sct_noitem\">등록된 상품이 없습니다.</p>\n";
?>
</div>
<script>
$(".sct-size button").click(function () {
$(".sct-size button").removeClass("active");
$(this).addClass("active");
});
$("#btn-small").click(function () {
$(".sct_wrap").removeClass("big").addClass("small");
});
$("#btn-big").click(function () {
$(".sct_wrap").removeClass("small").addClass("big");
});
</script>
<!-- } 상품진열 10 끝 -->
!-->!-->
답변 2
for문 loop만큼 id='dealCountdown'가 반복 되겠죠?
한 페이지에 id가 동일한 것이 있으면 안된다는 것을 모르고있는 것 아닌가요?
이것만 고쳐서 될런지 모르겠습니다만 id가 중복 되지않게 두 군데를 고쳐보세요
id='dealCountdown<=$i?>'
$('#dealCountdown<?=$i?>').countdown
좋은 지적 감사힙니다