체크하면 자동계산을 수량추가 계산식을 추가 하고 싶습니다...
본문
자바스크립트 수량 증가에 따른 계산법을 추가하려고 하는데요
제가 초보라서 잘 몰라서 질문 드립니다...
기존에는 체크박스를 누르면 체크박스 안에 있는 벨류가 계산이 되는 방식인데
수량칸을 따로 만들어서 수랴 증가에 따라서 계산값을 바꾸고 싶습니다...
고수님들 부탁드립니다..
지금 사용하고 있는 소스코드를 보여드리면
----------파일 내용--------
<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
<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>
<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);
let qty = document.getElementById("qty" + i);
if (chkbox && chkbox.checked) {
total += Number(chkbox.value) * Number(qty.value);
}
}
// 숫자 형식을 변경하여 total을 업데이트
document.getElementById("total").value = total.toLocaleString();
}
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>
감사합니다! 아주 잘되요!!
혹시 뭐 하나만 더 여쭈어 봐도 될까요
여분필드를 wr_75까지는 생성이 되는데 그 이상으로 생성이 안되더라구여
혹시 방법이 있을까요....?
한 행의 최대 사이즈 제한 때문입니다.
wr_1 ~ wr_75 의 데이터타입을 varchar(255) 에서 varchar(20) 으로 변경해주면 남은 공간만큼 필드 추가가 가능해집니다.
감사합니다!! 친절한설명 덕분에!! 잘 해결했습니다!
마지막으로 하나만 더 여쭈어 봐도 될까요!!
<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 에다가 넣으려면 어떻게 해야되나요...!!
<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">