ajax.action.php 파일에 추가한 입력 폼 필수 항목 체크하는 방법 채택완료
해당 링크를 참고하여, 상세페이지 내에 추가입력 폼을 삽입하였습니다.
+ 메인 리스트 장바구니 버튼 클릭 시 나오는 옵션 선택 사항에도 해당 폼을 추가해주었는데요
선택옵션만 선택하고 추가입력폼이 공란일 경우 선택해 달라는 경고창을 띄우고 싶은데
어디에 alert을 삽입해야할지 엮여 있는 소스가 너무 많아서 적용을 못하고 있습니다.
shop.list.action.js 에 선택옵션 경고창이 뜨는 부분을 찾아 아래에 넣어줘도 반응 없이 장바구니에 담기는 현상이 발생하고 있습니다.
</p>
<p> </p>
<p>//ajax.action.php</p>
<p><div class="sct_cartop_wr"></p>
<p> <form name="fcart" method="post" action="<?php echo $action_url; ?>"></p>
<p> <input type="hidden" name="action" value="cart_update"></p>
<p> <input type="hidden" name="it_id[]" value="<?php echo $it['it_id']; ?>"></p>
<p> <input type="hidden" name="it_name[]" value="<?php echo stripslashes($it['it_name']); ?>"></p>
<p> <input type="hidden" name="it_price[]" value="<?php echo get_price($it); ?>"></p>
<p> <input type="hidden" name="it_stock[]" value="<?php echo get_it_stock_qty($it['it_id']); ?>"></p>
<p> <input type="hidden" name="io_type[<?php echo $it['it_id']; ?>][]" value="0"></p>
<p> <input type="hidden" name="io_id[<?php echo $it['it_id']; ?>][]" value=""></p>
<p> <input type="hidden" name="io_value[<?php echo $it['it_id']; ?>][]" value=""></p>
<p> <input type="hidden" name="io_price[<?php echo $it['it_id']; ?>][]" value=""></p>
<p> <input type="hidden" name="ct_qty[<?php echo $it['it_id']; ?>][]" value="<?php echo $item_ct_qty; ?>"></p>
<p> <input type="hidden" name="sw_direct" value="0"></p>
<p> <?php</p>
<p> if($option_item) {</p>
<p> $is_option = 1;</p>
<p> ?></p>
<p> <!-- 별도 작업 요청사항 시작 { --></p>
<p> <div id="sit_spinput"></p>
<p> <div class="get_item_options"></p>
<p> <label>상담희망일자</label></p>
<p> <span><input name="work_msg" type="text" id="work_msg" readonly required placeholder="희망일자를 선택해주세요."></input></span></p>
<p> </div></p>
<p> </div></p>
<p> <!-- } 별도 작업 요청사항 끝 --></p>
<p> <?php // 선택옵션</p>
<p> echo $option_item;</p>
<p> ?></p>
<p> <?php</p>
<p> if($supply_item) {</p>
<p> ?></p>
<p> <?php // 추가옵션</p>
<p> echo $supply_item;</p>
<p> ?></p>
<p> <!-- } 추가옵션 끝 --></p>
<p> <?php</p>
<p> }</p>
<p> ?></p>
<p> <button type="button" class="cartopt_cart_btn">장바구니 담기</button></p>
<p> <button type="button" class="cartopt_close_btn">닫기</button></p>
<p> </p>
<p> <?php } ?></p>
<p> </form></p>
<p> </div></p>
<p> </p>
<p>//shop.list.action.js</p>
<p><scrpt></p>
<p>var mainCart = mainCart || {};</p>
<p> </p>
<p>mainCart.chr = function(code){</p>
<p> return String.fromCharCode(code);</p>
<p>}</p>
<p> </p>
<p>jQuery(function ($) {</p>
<p> </p>
<p> var select_option_el = "select.it_option",</p>
<p> overclass = "overlay",</p>
<p> cartclass = "sct_cartop",</p>
<p> cart_btn_class = "sct_btn";</p>
<p> </p>
<p> mainCart.add_wishitem = function(el) {</p>
<p> </p>
<p> var $el = $(el),</p>
<p> it_id = $el.data("it_id");</p>
<p> </p>
<p> if(!it_id) {</p>
<p> alert("상품코드가 올바르지 않습니다.");</p>
<p> return false;</p>
<p> }</p>
<p> </p>
<p> $.post(</p>
<p> g5_shop_url + "/ajax.action.php",</p>
<p> { it_id: it_id, action : "wish_update" },</p>
<p> function(error) {</p>
<p> if(error != "OK") {</p>
<p> alert(error.replace(/\\n/g, "\n"));</p>
<p> return false;</p>
<p> }</p>
<p> </p>
<p> mainCart.update_wish_side();</p>
<p> alert("상품을 위시리스트에 담았습니다.");</p>
<p> return;</p>
<p> }</p>
<p> );</p>
<p> }</p>
<p> </p>
<p> mainCart.add_cart = function(frm) {</p>
<p> </p>
<p> var $frm = $(frm);</p>
<p> var $sel = $frm.find(select_option_el);</p>
<p> var it_name = $frm.find("input[name^=it_name]").val();</p>
<p> var it_price = parseInt($frm.find("input[name^=it_price]").val());</p>
<p> var id = "";</p>
<p> var value, info, sel_opt, item, price, stock, run_error = false;</p>
<p> var option = sep = "";</p>
<p> var count = $sel.length;</p>
<p> </p>
<p> if(count > 0) {</p>
<p> $sel.each(function(index) {</p>
<p> value = $(this).val();</p>
<p> item = $(this).prev("label").text();</p>
<p> </p>
<p> if(!value) {</p>
<p> run_error = true;</p>
<p> return false;</p>
<p> }</p>
<p> </p>
<p> // 옵션선택정보</p>
<p> sel_opt = value.split(",")[0];</p>
<p> </p>
<p> if(id == "") {</p>
<p> id = sel_opt;</p>
<p> } else {</p>
<p> id += mainCart.chr(30)+sel_opt;</p>
<p> sep = " / ";</p>
<p> }</p>
<p> </p>
<p> option += sep + item + ":" + sel_opt;</p>
<p> });</p>
<p> </p>
<p> if(run_error) {</p>
<p> alert(it_name+"의 "+item+"을(를) 선택해 주십시오.");</p>
<p> return false;</p>
<p> }</p>
<p> </p>
<p> price = value[1];</p>
<p> stock = value[2];</p>
<p> } else {</p>
<p> price = 0;</p>
<p> stock = $frm.find("input[name^=it_stock]").val();</p>
<p> option = it_name;</p>
<p> }</p>
<p> </p>
<p> // 금액 음수 체크</p>
<p> if(it_price + parseInt(price) < 0) {</p>
<p> alert("구매금액이 음수인 상품은 구매할 수 없습니다.");</p>
<p> mainCart.add_cart_after();</p>
<p> return false;</p>
<p> }</p>
<p> // 옵션 선택정보 적용</p>
<p> $frm.find("input[name^=io_id]").val(id);</p>
<p> $frm.find("input[name^=io_value]").val(option);</p>
<p> $frm.find("input[name^=io_price]").val(price);</p>
<p> </p>
<p> $.ajax({</p>
<p> url: $(frm).attr("action"),</p>
<p> type: "POST",</p>
<p> data: $(frm).serialize(),</p>
<p> dataType: "json",</p>
<p> async: true,</p>
<p> cache: false,</p>
<p> success: function(data, textStatus) {</p>
<p> </p>
<p> mainCart.add_cart_after(frm);</p>
<p> </p>
<p> if(data.error != "") {</p>
<p> alert(data.error);</p>
<p> return false;</p>
<p> }</p>
<p> </p>
<p> mainCart.update_cart_side();</p>
<p> </p>
<p> alert("상품을 장바구니에 담았습니다.");</p>
<p> },</p>
<p> error : function(request, status, error){</p>
<p> mainCart.add_cart_after(frm);</p>
<p> alert('false ajax :'+request.responseText);</p>
<p> }</p>
<p> });</p>
<p> </p>
<p> return false;</p>
<p> }</p>
<p> </p>
<p> // 5.4 버전의 기본테마의 사이드바의 장바구니를 새로고침합니다.</p>
<p> mainCart.update_cart_side = function(){</p>
<p> var ajax_url = g5_shop_url || g5_shop_url;</p>
<p> </p>
<p> $.ajax({</p>
<p> url: ajax_url + "/ajax.action.php",</p>
<p> type: "GET",</p>
<p> data: {"action":"refresh_cart"},</p>
<p> dataType: "html",</p>
<p> async: true,</p>
<p> cache: false,</p>
<p> success: function(data, textStatus) {</p>
<p> var inner_html = $(data).filter(".sbsk").html(),</p>
<p> cart_count = $(data).find(".cart-count").text();</p>
<p> </p>
<p> $(".qk_con_wr .sbsk").html(inner_html);</p>
<p> $(".hd_login .shop_cart .count").text(cart_count);</p>
<p> },</p>
<p> error : function(request, status, error){</p>
<p> alert("false ajax :"+request.responseText);</p>
<p> }</p>
<p> });</p>
<p> </p>
<p> return true;</p>
<p> }</p>
<p> </p>
<p> mainCart.update_wish_side = function(){</p>
<p> var ajax_url = g5_shop_url || g5_shop_url;</p>
<p> </p>
<p> if (typeof g5_is_member == "undefined" || ! g5_is_member) {</p>
<p> return false;</p>
<p> }</p>
<p> </p>
<p> $.ajax({</p>
<p> url: ajax_url + "/ajax.action.php",</p>
<p> type: "GET",</p>
<p> data: {"action":"refresh_wish"},</p>
<p> dataType: "html",</p>
<p> async: true,</p>
<p> cache: false,</p>
<p> success: function(data, textStatus) {</p>
<p> var inner_html = $(data).filter(".side-wish").html();</p>
<p> </p>
<p> $(".qk_con_wr .side-wish").html(inner_html);</p>
<p> },</p>
<p> error : function(request, status, error){</p>
<p> alert("false ajax :"+request.responseText);</p>
<p> }</p>
<p> });</p>
<p> </p>
<p> return true;</p>
<p> }</p>
<p> </p>
<p> mainCart.add_cart_after = function(frm){</p>
<p> var $over_rayers = $("."+overclass),</p>
<p> $cart_rayers = $("."+cartclass);</p>
<p> </p>
<p> $over_rayers.each(function(i) {</p>
<p> $(this).removeClass(overclass);</p>
<p> });</p>
<p> </p>
<p> $cart_rayers.each(function(i) {</p>
<p> if( !(frm && $(this).find("select").length) ){</p>
<p> $(this).html("").removeClass(cartclass);</p>
<p> }</p>
<p> });</p>
<p> }</p>
<p> </p>
<p> $(document).on("click", ".btn_cart", function(e) {</p>
<p> e.preventDefault();</p>
<p> </p>
<p> var $this = $(this),</p>
<p> it_id = $this.data("it_id"),</p>
<p> $sct_li = $this.closest("li.sct_li"),</p>
<p> $opt = $sct_li.find(".cart-layer"),</p>
<p> $btn = $sct_li.find("."+cart_btn_class);</p>
<p> </p>
<p> $(".cart-layer").not($opt).removeClass(cartclass).html('');</p>
<p> $("li.sct_li").not($sct_li).removeClass(overclass);</p>
<p> </p>
<p> $.ajax({</p>
<p> url: g5_shop_url+"/ajax.action.php",</p>
<p> type: "POST",</p>
<p> data: {</p>
<p> "it_id" : it_id,</p>
<p> "action" : "get_item_option"</p>
<p> },</p>
<p> dataType: "json",</p>
<p> async: true,</p>
<p> cache: false,</p>
<p> success: function(data, textStatus) {</p>
<p> if(data.error != "") {</p>
<p> alert(data.error);</p>
<p> return false;</p>
<p> }</p>
<p> </p>
<p> $sct_li.addClass(overclass);</p>
<p> $opt.addClass(cartclass).html(data.html);</p>
<p> </p>
<p> if(!data.option) {</p>
<p> mainCart.add_cart($opt.find("form").get(0));</p>
<p> return;</p>
<p> }</p>
<p> </p>
<p> //$btn.css("display","none");</p>
<p> //$opt.css("display","block");</p>
<p> },</p>
<p> error : function(request, status, error){</p>
<p> alert('false ajax :'+request.responseText);</p>
<p> }</p>
<p> });</p>
<p> });</p>
<p> </p>
<p> $(document).on("change", "select.it_option", function() {</p>
<p> var $frm = $(this).closest("form");</p>
<p> var $sel = $frm.find("select.it_option");</p>
<p> var sel_count = $sel.length;</p>
<p> var idx = $sel.index($(this));</p>
<p> var val = $(this).val();</p>
<p> var it_id = $frm.find("input[name='it_id[]']").val();</p>
<p> </p>
<p> // 선택값이 없을 경우 하위 옵션은 disabled</p>
<p> if(val == "") {</p>
<p> $frm.find("select.it_option:gt("+idx+")").val("").attr("disabled", true);</p>
<p> return;</p>
<p> }</p>
<p> </p>
<p> // 하위선택옵션로드</p>
<p> if(sel_count > 1 && (idx + 1) < sel_count) {</p>
<p> var opt_id = "";</p>
<p> </p>
<p> // 상위 옵션의 값을 읽어 옵션id 만듬</p>
<p> if(idx > 0) {</p>
<p> $frm.find("select.it_option:lt("+idx+")").each(function() {</p>
<p> if(!opt_id)</p>
<p> opt_id = $(this).val();</p>
<p> else</p>
<p> opt_id += mainCart.chr(30)+$(this).val();</p>
<p> });</p>
<p> </p>
<p> opt_id += mainCart.chr(30)+val;</p>
<p> } else if(idx == 0) {</p>
<p> opt_id = val;</p>
<p> }</p>
<p> </p>
<p> $.post(</p>
<p> g5_shop_url + "/itemoption.php",</p>
<p> { it_id: it_id, opt_id: opt_id, idx: idx, sel_count: sel_count },</p>
<p> function(data) {</p>
<p> $sel.eq(idx+1).empty().html(data).attr("disabled", false);</p>
<p> </p>
<p> // select의 옵션이 변경됐을 경우 하위 옵션 disabled</p>
<p> if(idx+1 < sel_count) {</p>
<p> var idx2 = idx + 1;</p>
<p> $frm.find("select.it_option:gt("+idx2+")").val("").attr("disabled", true);</p>
<p> }</p>
<p> }</p>
<p> );</p>
<p> } else if((idx + 1) == sel_count) { // 선택옵션처리</p>
<p> if(val == "")</p>
<p> return;</p>
<p> </p>
<p> var info = val.split(",");</p>
<p> // 재고체크</p>
<p> if(parseInt(info[2]) < 1) {</p>
<p> alert("선택하신 선택옵션상품은 재고가 부족하여 구매할 수 없습니다.");</p>
<p> return false;</p>
<p> }</p>
<p> }</p>
<p> });</p>
<p> </p>
<p> $(document).on("click", ".cartopt_cart_btn", function(e) {</p>
<p> e.preventDefault();</p>
<p> </p>
<p> mainCart.add_cart(this.form);</p>
<p> });</p>
<p> </p>
<p> $(document).on("click", ".cartopt_close_btn", function(e) {</p>
<p> e.preventDefault();</p>
<p> </p>
<p> mainCart.add_cart_after();</p>
<p> </p>
<p> //$(this).closest(".sct_cartop").css("display","none");</p>
<p> //$(this).closest("li.sct_li").find(".sct_btn").css("display", "");</p>
<p> });</p>
<p> </p>
<p> $(document).on("click", ".btn_wish", function(e) {</p>
<p> e.preventDefault();</p>
<p> </p>
<p> mainCart.add_wishitem(this);</p>
<p> });</p>
<p>});</p>
<p></script></p>
<p>
어느 부분에서 경고창을 띄워야 하는지 고수님들의 조언을 부탁드립니다 ㅠ
댓글을 작성하려면 로그인이 필요합니다.
답변 1개
채택된 답변
+20 포인트
7개월 전
mainCart.add_cart() 함수의
// 금액 음수 체크 전에
추가해보면 어떨까 싶습니다.
// 상담희망일자 필드 검증
var $work_msg = $frm.find("input[name=work_msg]");
if ($work_msg.length > 0 && $work_msg.attr("required") && $work_msg.val() == "") {
alert("희망일자를 선택해주세요.");
$work_msg.focus();
return false;
}
로그인 후 평가할 수 있습니다
답변에 대한 댓글 1개
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인전체 질문 목록
답변대기
답변대기
답변대기
답변대기
답변대기
답변대기
답변대기
답변대기
채택
답변대기
답변대기
답변대기
답변대기
채택
채택
답변대기
답변대기
답변대기
채택