테스트 사이트 - 개발 중인 베타 버전입니다

체크하면 자동계산을 수량추가 계산식을 추가 하고 싶습니다... 채택완료

wnsah6288 1년 전 조회 7,744

자바스크립트 수량 증가에 따른 계산법을 추가하려고 하는데요

 

제가 초보라서 잘 몰라서 질문 드립니다...

 

기존에는 체크박스를 누르면 체크박스 안에 있는 벨류가 계산이 되는 방식인데

 

수량칸을 따로 만들어서 수랴 증가에 따라서 계산값을 바꾸고 싶습니다...

 

고수님들 부탁드립니다..

 

 

 

 

지금 사용하고 있는 소스코드를 보여드리면

 

 

----------파일 내용--------

 

<table>

<td>

<input type="checkbox" name="wr_6" id="price1" value="10800"<?php echo ($write['wr_6'] == "10800") ? " checked" : "";?>> 

</td>

<td>

<!--수량증가 추가 하고 싶습니다. -->

 

 

</td>

</table>

 

 

<div id="footer">

    <p style="margin-top: 20px; ">예상 견적가<input class="text-font1" type="text" name="total" id="total" value="0" readonly="readonly">원</p>

</div>

 

----------스크립트 내용---------

<script>

 

    function Calculator(){

        let total = Number(document.getElementById("total").defaultValue);

    

        for(let i = 1; i <= 100; i++){

            let chkbox = document.getElementById("price" + i);

            if(chkbox && chkbox.checked){

                total += Number(chkbox.value);

            }

             

        }

        // 숫자 형식을 변경하여 total을 업데이트

        document.getElementById("total").value = total.toLocaleString();

    }

    

    for(let i = 1; i <= 100; i++){

        let check = document.getElementById("price" + i);

        if(check){

            check.onclick = Calculator;

        }

    }

</script>

댓글을 작성하려면 로그인이 필요합니다.

답변 1개

채택된 답변
+20 포인트
1년 전

</p>

<p><table>

<tr>

    <td>

        <input type="checkbox" name="wr_6" id="price1" value="10800"<?php echo ($write['wr_6'] == "10800") ? " checked" : "";?>>

    </td>

    <td>

        <input type="text" id="qty1">개

    </td>

</tr>

</table></p>

<p>

<div id="footer">

    <p style="margin-top: 20px; ">예상 견적가<input class="text-font1" type="text" name="total" id="total" value="0" readonly="readonly">원</p>

</div></p>

<p><script>

function Calculator() {

    let total = Number(document.getElementById("total").defaultValue);</p>

<p>    for(let i = 1; i <= 100; i++){

        let chkbox = document.getElementById("price" + i);

        let qty = document.getElementById("qty" + i);</p>

<p>        if (chkbox && chkbox.checked) {

            total += Number(chkbox.value) * Number(qty.value);

        }

    }</p>

<p>    // 숫자 형식을 변경하여 total을 업데이트

    document.getElementById("total").value = total.toLocaleString();

}</p>

<p>

for(let i = 1; i <= 100; i++) {

    let check = document.getElementById("price" + i);

    let check2 = document.getElementById("qty" + i);

    if (check) {

        check.onclick = Calculator;

    }

    if (check2) {

        check2.onchange = Calculator;

    }    

}

</script></p>

<p>

로그인 후 평가할 수 있습니다

답변에 대한 댓글 4개

w
wnsah6288
1년 전
감사합니다! 아주 잘되요!!

혹시 뭐 하나만 더 여쭈어 봐도 될까요

여분필드를 wr_75까지는 생성이 되는데 그 이상으로 생성이 안되더라구여

혹시 방법이 있을까요....?
마르스컴퍼니
1년 전
한 행의 최대 사이즈 제한 때문입니다.

wr_1 ~ wr_75 의 데이터타입을 varchar(255) 에서 varchar(20) 으로 변경해주면 남은 공간만큼 필드 추가가 가능해집니다.
w
wnsah6288
1년 전
감사합니다!! 친절한설명 덕분에!! 잘 해결했습니다!

마지막으로 하나만 더 여쭈어 봐도 될까요!!

<p style="margin-top: 20px; color:#fff;">예상 견적가<input class="text-font1" type="text" name="total" id="total" value="0" readonly="readonly">원</p>

여기 태그에서 id="total"로 계산된 값을 가져온 것을 wr_100 db 에다가 넣으려면 어떻게 해야되나요...!!
마르스컴퍼니
1년 전
<input class="text-font1" type="text" name="total" id="total" value="0" readonly="readonly">

<input class="text-font1" type="text" name="wr_100" id="total" value="0" readonly="readonly">

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인