코딩 질문이 있어요ㅠㅠ

매출이 오르면 내리는 수수료! 지금 수수료센터에서 전자결제(PG)수수료 비교견적 신청해 보세요!
코딩 질문이 있어요ㅠㅠ

QA

코딩 질문이 있어요ㅠㅠ

답변 1

본문

<!-- POP만들기 -->

<div id="leaflet_app">

<!-- widget -->

<div class="widget_wrap full">

<div class="clfix widget">

<h4>POP만들기</h4>

<div class="widget-content" style="background-color:#c0c0c0">

<div id="leaflet_template">

<!-- htmldata -->

<style>

#leaflet_template > .tmpl > .wrap {width:100%; height:100%; background-color:#ffffff}

#leaflet_template > .tmpl > .wrap > .background {position:absolute; top:0; left:0; width:100%}

#leaflet_template > .tmpl > .wrap > .leaflet_subject {overflow:hidden; position:absolute; top:20mm; /* left:0mm; */ width:210mm; height:38mm; color:#fff !important; font-family:'GmarketSansBold'; font-size:20mm; line-height:40mm; text-align:right}

#leaflet_template > .tmpl > .wrap >.merge1 {width:794px;height:38px;background-color:#ff3823;display: inline-block;}

#leaflet_template > .tmpl > .wrap >.merge1 > .leaflet_desc {position:absolute; top:41.5mm; left:8mm; width:100%; color:#27a774; !important; font-family:'GmarketSansMedium'; font-size:12.2mm; line-height:10mm; text-align:left; letter-spacing:-2px; }

#leaflet_template > .tmpl > .wrap > .subject {position:absolute; top:240mm; left:8mm; width:210mm; color:#000 !important; font-family:'GmarketSansMedium'; font-size:14mm; line-height:20mm; text-align:left; /* letter-spacing:-1mm; */ /*text-shadow: -3px -3px 0 #fff, 3px -3px 0 #fff, -3px 3px 0 #fff, 3px 3px #fff;*/}

                    #leaflet_template > .tmpl > .wrap > .image {position:absolute; top:70mm; left:30mm; width:150mm; height:150mm; color:#000 !important; font-family:'GmarketSansMedium'; font-size:17mm; line-height:20mm; text-align:center; letter-spacing:-1mm}

                    #leaflet_template > .tmpl > .wrap > .image > img {max-width:150mm; max-height:130mm; width:100%; height:100%}

#leaflet_template > .tmpl > .wrap > .price_sale {position:absolute; bottom:-2mm;right:8mm; width:210mm; color:#f40500; !important; font-family:'GmarketSansBold'; font-size:34mm; line-height:35mm; text-align:right; letter-spacing:-2mm}

#leaflet_template > .tmpl > .wrap > .price_sale > .won {margin-left:10px; font-family: 'GmarketSansBold'; font-size: 60px; color:#f40500; !important}

#leaflet_template > .tmpl > .wrap > .price > .won { color:#f40500; !important}

#leaflet_template > .tmpl > .wrap > .price {position:absolute; bottom:3mm; left:12mm; color:#999999 !important; font-family:'GmarketSansMedium'; font-size:12mm; line-height:24mm; text-align:left; /* letter-spacing:-1mm; */ text-decoration:line-through}

#leaflet_template > .tmpl > .wrap >.merge {position:absolute; bottom:58mm; left:9mm; width:230px;height:62px;background-color:#ff3823;border-radius: 6px; display:flex; align-items: center;flex-direction: column;justify-content: center;}

#leaflet_template > .tmpl > .wrap > .merge > .leaflet_option {width:100%; color:#fff !important; font-family:'GmarketSansMedium'; font-size:12mm; /* line-height:8mm; */ text-align:center; /* letter-spacing:-1mm;/ */padding: 10px 0 0 0;}

#leaflet_template > .tmpl > .wrap > .unit {position:absolute; bottom:60mm;background-color:#ff3823;}

 

 

@media print{

{size:portrait}

html, body {width:210mm !important; height:297mm !important}

}

</style>

<div class="tmpl vertical">

<div id="print-area" class="wrap" data-itemid="0">

<div class="background"><img src="/assets/leaflet/leaflet_bg_20.jpg" style="width:100%"></div>

<div class="leaflet_subject"></div>

<div class="merge1">

<div class="leaflet_desc"></div>

</div>

<div class="merge">

<div class="leaflet_option"></div>

</div>

<div class="price item_0_price"><span class='won'></span></div>

                            <div class="image item_0_image"><img src="/uploads/spop_imagedb/2021/04//b2e4a9d30bcb8aba4b04a40dc83d02b0.png"></div>

<div class="subject item_0_subject"></div>

<div class="price_sale item_0_price_sale"><span class='won'></span></div>

<div class="unit item_0_unit"></div>

 

</div>

</div>

<!-- //htmldata -->

</div>

</div>

</div>

</div>

<!-- //widget -->

</div>

<!-- //POP만들기 -->

 

<!-- 수정/삭제 모달 -->

<div class="modal select" id="modal_edit" tabindex="-1" role="dialog" aria-hidden="true">

<div class="modal-dialog modal-xs">

<div class="modal-content">

<h4 class="modal-title dark align-center">수정하기</h4>

<div class="widget-content">

<div class="p-20">

<div class="row">

                        <div class="col-xs-5">

<div class="mb-15">

                                <span id="mf_image" class="image" style="display:inline-block; border:1px solid #ccc; padding:40px"><img src='/images/no_image.png' data-src="" width="100" height="100" style="width:100px; height:100px"></span>

</div>

                            <div>

                                <button type="button" onclick="leaflet.select_image.from_pc()" class="btn btn-white"><i class="fas fa-search"></i> 내사진</button>

                                <button type="button" onclick="leaflet.select_image.open()" class="btn btn-primary">라이브러리</button>

                                <input type="file" name="image_file" id="item_file" value="" style="display:none" accept="image/jpeg, image/png" onchange="leaflet.select_image.upload()">

                            </div>

</div>

<div class="col-xs-7">

<div class="mb-15">

<label for="mf_subject" class="form-label mb-5">제목</label>

<input type="text" id="mf_subject" name="mf_subject" class="form-control">

</div>

                            <div class="mb-15">

<label for="mf_desc" class="form-label mb-5">행사기간</label>

<input type="text" id="mf_desc" name="mf_desc" class="form-control">

</div>

<div class="mb-15">

<label for="mf_option" class="form-label mb-5">옵션</label>

<input type="text" id="mf_option" name="mf_option" class="form-control">

</div>

<div class="mb-15">

<label for="mf_unit" class="form-label mb-5">단위</label>

<input type="text" id="mf_item_unit" name="mf_unit" class="form-control">

</div>

<div class="row">

<div class="col-xs-6">

<div class="mb-15">

<label for="mf_item_price" class="form-label mb-5">정상가</label>

<input type="text" id="mf_item_price" name="mf_item_price" class="form-control">

</div>

</div>

<div class="mb-15">

<label for="mf_item_subject" class="form-label mb-5">상품명</label>

<input type="text" id="mf_item_subject" name="mf_item_subject" class="form-control">

</div>

<div class="mb-15">

<label for="mf_item_price_sale" class="form-label mb-5">할인가</label>

<input type="text" id="mf_item_price_sale" name="mf_item_price_sale" class="form-control">

</div>

</div>

</div>

</div>

</div>

<div class="modal-footer">

<button type="button" class="btn btn-secondary" data-dismiss="modal">취소</button>

<button type="button" class="btn btn-primary" onclick="leaflet.item.update_value(); $('#modal_edit').modal('hide')"><i class='fas fa-check'></i> 수정하기</button>

</div>

</div>

</div>

</div>

<!-- //수정/삭제 선택 모달 -->

<!-- 이미지 라이브러리 리스트 모달 -->

<div class="modal select" id="modal_get_imagedb" tabindex="-1" role="dialog" aria-hidden="true">

<div class="modal-dialog modal-lg">

<div class="modal-content">

<h4 class="modal-title dark align-center">이미지 라이브러리</h4>

<div class="widget-content">

<div class="search">

<form onsubmit="return search_imagedb_modal(this)">

<select class="select2" id="imagedb_category1" data-link="imagedb_category2" onchange="change_category(this)">

<option value=''>전체분류</option>

<?php

//

$parent_no = 0;

if ($this->input->get("category_no")) {

foreach ($imagedb_category_list as $key => $v) {

if ($v['category_no'] == $this->input->get("category_no")) {

$parent_no = $v['parent_no'];

}

}

}

 

foreach ($imagedb_category_list as $key => $v) {

if ($v['parent_no'] == '0') {

echo "<option value='".$v['category_no']."' ".(($parent_no == $v['category_no']) ? "selected='selected'" : "").">".$v['name']."</option>";

}

}

?>

</select>

<select class="select2" id="imagedb_category2" name="category_no">

<option value="">소분류</option>

</select>

<input type="text" class="form-control input-width-large inline" name="subject" placeholder="상품이름 입력" value=""> 

<input type="submit" class="btn btn-default" id="check" value="조회">

</form>

</div>

<div class="list_wrap"></div>

</div>

<div class="modal-footer">

<button type="button" class="btn btn-secondary" onclick="$('#modal_get_imagedb').modal('hide'); $('#modal_select_image').modal('show')">뒤로</button>

<button type="button" class="btn btn-secondary" data-dismiss="modal"><i class='fas fa-times'></i> 닫기</button>

</div>

</div>

</div>

</div>

<!-- //이미지 라이브러리 리스트 모달 -->

 

 

<!-- leaflet -->

<script>

<?php

if ($leaflet['data']) {

//echo "leaflet.data = {$leaflet['data']};";

}

?>

 

leaflet.data = {

subject: {

text: "단하루만!\n추천특가",

color: "#ffffff",

font: "GmarketSansBold",

vertical: "N",

square: "N"

},

option: {

text: "한정상품",

color: "#fff",

font: "GmarketSansMedium",

},

desc: {

text: "00월 00일 0요일",

color: "#27a774",

font: "GmarketSansMedium",

},

 

item: [

{

subject: {

text: "양배추 1통",

color: "#000000",

font: "GmarketSansMedium",

},

price: {

text: "10,900원",

color: "#999999",

font: "GmarketSansMedium",

},

price_sale: {

text: "12,990원",

color: "#f40500",

font: "GmarketSansBold",

},

unit: {

text: "1통",

color: "#000000",

font: "GmarketSansMedium",

},

            image: "/uploads/spop_imagedb/2021/04//b2e4a9d30bcb8aba4b04a40dc83d02b0.png"

}

]

};

$("#print-area").click(function(){

var itemid = $(this).data('itemid');

leaflet.item.selected_itemid = itemid;

console.log("itemid : " + itemid);

 

$("#mf_subject").val(leaflet.data.subject.text);

$("#mf_desc").val(leaflet.data.desc.text);

$("#mf_item_subject").val(leaflet.data.item[itemid].subject.text);

$("#mf_item_price_sale").val(leaflet.data.item[itemid].price_sale.text);

$("#mf_item_unit").val(leaflet.data.item[itemid].unit.text);

 

    if (leaflet.data.item[itemid].image == "") {

        $("#mf_image img").attr('src', '/images/no_image.png');

    } else {

        $("#mf_image img").attr('src', leaflet.data.item[itemid].image);

        $('#modal_edit .image').css({

            'padding': '10px'

        });

        $('#modal_edit .image img').data('src', leaflet.data.item[itemid].image);

        $('#modal_edit .image img').css({

            'width': '200px',

            'height': '200px'

        });

    }

 

$("#modal_edit").modal();

});

</script>

<!-- //leaflet -->

 

unit에 값을 받아서 넣고 싶은데 unit만 값이 들어오지 않아요 문제가 무엇일까요ㅠㅠㅠ 해결방안 좀 알려주세요 코딩 고수님들ㅠㅠ

이 질문에 댓글 쓰기 :

답변 1

다음을 참고하셔서 원하시는 형식으로 코딩을 하시면 가능하지 않을까 합니다.


<div class="mb-15">
    <label for="mf_unit" class="form-label mb-5">단위</label>
    <input type="text" id="mf_unit" name="mf_unit" class="form-control">
</div>

 


leaflet.data.item[0].unit = {
    text: "포장",
    color: "#000000",
    font: "GmarketSansMedium"
};
답변을 작성하시기 전에 로그인 해주세요.
QA 내용 검색
질문등록
전체 7
© SIRSOFT
현재 페이지 제일 처음으로