[PHP, JS] อยากทราบว่าใครมี Code ตามรายละเอียดไหมครับ ?

ถาม-ตอบ แนะนำไอเดียว โค้ดตัวอย่าง แนวทาง วิธีแก้ปัญหา [PHP, JS] อยากทราบว่าใครมี Code ตามรายละเอียดไหมครับ ?

[PHP, JS] อยากทราบว่าใครมี Code ตามรายละเอียดไหมครับ ?

สวัสดีครับ พอดีผมจะทำระบบสั่งซื้ออุปกรณ์นักศึกษาของมหาวิทยาลัยแห่งหนึ่ง แล้วทีนี้เจอข้อผิดพลาดครับ
พอกด Checkbox ให้ value = "1" แล้ว และเลือกจำนวน ช่องสุดท้ายผมไม่แสดงของแถวที่ 2 อุปกรณ์นักศึกษาชาย ไม่แสดงผลรวมที่กรอกฟังก์ชันมาให้ แต่มันไปแสดงในแถวที่ 3 อุปกรณ์นักศึกษาหญิงแทน

Fb1649390008 08-04-2022 19:07:54

คำแนะนำ และการใช้งาน

สมาชิก กรุณา ล็อกอินเข้าระบบ เพื่อตั้งคำถามใหม่ หรือ ตอบคำถาม สมาชิกใหม่ สมัครสมาชิกได้ที่ สมัครสมาชิก

ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ
User

Pass

Code
เปลี่ยน

จำข้อมูลการล็อกอิน
เข้าระบบอัตโนมัติ

( หรือ เข้าใช้งานผ่าน Social Login )

ล็อกอินด้วย Line

ล็อกอินด้วย Google

ล็อกอินด้วย Twitter

ล็อกอินด้วย Tiktok

ความคิดเห็นที่ 1

<!DOCTYPE html>
<html lang="th">
<?php
//session_start();
?>

<head>
    <meta charset="utf-8">
    <title>ระบบสั่งซื้อ</title>
    <meta name="viewport" contact="width=device-width, initial-scale=1">
    <link rel="icon" href="../../favicon.ico">
    <meta name="viewport" contact="width=device-width, initial-scale=1">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.10.2/dist/umd/popper.min.js" integrity="sha384-7+zCNj/IqJ95wo16oMtfsKbZ9ccEh31eOz1HGyDuCQ6wgnyJNSYdrPa03rtR1zdB" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.min.js" integrity="sha384-QJHtvGhmr9XOIpI6YVutG+2QOK9T+ZnN4kzFN1RtK3zEFEIsxhlmWl5/YESvpZ13" crossorigin="anonymous"></script>

    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Prompt">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.8.1/font/bootstrap-icons.css">
    <?php include '../css.css'; ?>
    <?php include '../JS.php'; ?>
    <?php include 'JS.php'; ?>
</head>

<body>
    <nav class="navbar fixed-top navbar-light bg-light">
        <div class="container-fluid">
            <a class="navbar-brand"> </a>
            <form class="d-flex">
                <input type="text" class="form-control me-2" value="<?php echo "644466000 MR. Kornkan"; ?>" readonly>
                <button class="btn btn-outline-danger" type="logout">Logout</button>
            </form>
        </div>
    </nav>
    <input type="hidden" class="form-control" id="" name="" value="">
    <div class="container">
        <div class="row">
            <div class="py-5 text-center">
                <div class="spinner-border text-primary" style="width: 5rem; height: 5rem;" role="status">
                </div>
                <p></p>
                <h2>แบบสั่งซื้ออุปกรณ์นักศึกษา</h2>
                <h6>กรุณากรอกข้อมูลให้ครบถ้วนถูกต้อง</h6>
                <p></p>
                <br>
                <hr>
                <p></p>
                <br>
            </div>
        </div>
        <form method="post" action="#" name="order">
            <div class="row">
                <!-- ROW01 -->
                <div class="col-6">
                    <input type="text" class="form-control" id="" name="" value="" readonly>
                </div>
                <div class="col">
                    <input type="text" class="form-control" id="" name="" value="" readonly>
                </div>
                <div class="col">
                    <input type="text" class="form-control" id="" name="" value="" readonly>
                </div>
            </div>
            <br>
            <!-- รายการที่ 1 -->
            <div class="row">
                <!-- ROW02 -->
                <div class="col-6">
                    <div class="container">
                        <div class="row">
                            <div class="form-check">
                                <input class="form-check-input" type="checkbox" name="maleset" id="maleset" value="0" onFocus="startCalc1();" onBlur="stopCalc1();" onclick="myFunction1()"> อุปกรณ์นักศึกษาชาย </input>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col">
                            <ul>
                                <p id="text1" style="display:none">
                                    <input class="form-check-input" type="checkbox" id="necktie" name="necktie" value="" checked>
                                    <label class="form-check-label" for="necktie">
                                        เนคไทย<b>ชาย</b>
                                    </label>
                                    </input>
                                    <br>
                                    <input class="form-check-input" type="checkbox" id="headbeltmale" name="headbeltmale" value="" checked>
                                    <label class="form-check-label" for="headbeltmale">
                                        หัวเข็มขัด<b>ชาย</b>
                                    </label>
                                    </input>
                                    <br>
                                    <input class="form-check-input" type="checkbox" id="beltmale" name="beltmale" value="" checked>
                                    <label class="form-check-label" for="beltmale">
                                        สายเข็มขัด<b>ชาย</b> <select class="form-select" aria-label="Default select example">
                                            <option selected>กรุณาเลือกขนาดเข็มขัด</option>
                                            <option value="46 นิ้ว">46 นิ้ว</option>
                                            <option value="48 นิ้ว">48 นิ้ว</option>
                                            <option value="50 นิ้ว">50 นิ้ว</option>
                                            <option value="52 นิ้ว">52 นิ้ว</option>
                                            <option value="54 นิ้ว">54 นิ้ว</option>
                                            <option value="58 นิ้ว">58 นิ้ว</option>
                                        </select>
                                    </label>
                                    </label>
                                    </input>
                                    <br>
                                </p>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="col">
                    <input type="number" id="quamaleset" name="quamaleset" class="form-control" value="0" min="0" max="3" onFocus="startCalc1();" onBlur="stopCalc1();">
                </div>
                <div class="col">
                    <input type="text" class="form-control" id="malesetsum" name="malesetsum" value="0" readonly>
                </div>
            </div>
            <br>
            <!-- รายการที่ 2 -->
            <div class="row">
                <!-- ROW03 -->
                <div class="col-6">
                    <div class="container">
                        <div class="row">
                            <div class="form-check">
                                <input class="form-check-input" type="checkbox" name="femaleset" id="femaleset" value="1" onclick="myFunction2()" onFocus="startCalc2();" onBlur="stopCalc2();"> อุปกรณ์นักศึกษาหญิง </input>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col">
                            <ul>
                                <p id="text2" style="display:none">
                                    <input class="form-check-input" type="checkbox" id="kadum" name="kadum" value="" checked>
                                    <label class="form-check-label" for="kadum">
                                        กระดุม
                                    </label>
                                    </input>
                                    <br>
                                    <input class="form-check-input" type="checkbox" id="tidaok" name="tidaok" value="" checked>
                                    <label class="form-check-label" for="tidaok">
                                        ติดอก
                                    </label>
                                    </input>
                                    <br>
                                    <input class="form-check-input" type="checkbox" id="tungting" name="tungting" value="" checked>
                                    <label class="form-check-label" for="tungting">
                                        ตุ้งติ้ง
                                    </label>
                                    </input>
                                    <br>
                                    <input class="form-check-input" type="checkbox" id="headbeltfemale" name="headbeltfemale" value="" checked>
                                    <label class="form-check-label" for="headbeltfemale">
                                        หัวเข็มขัดหญิง
                                    </label>
                                    </input>
                                    <br>
                                    <input class="form-check-input" type="checkbox" id="beltfamale" name="beltfamale" value="" checked>
                                    <label class="form-check-label" for="beltfamale">
                                        สายเข็มขัด<b>ชาย</b> <select class="form-select" aria-label="Default select example">
                                            <option selected>กรุณาเลือกขนาดเข็มขัด</option>
                                            <option value="46 นิ้ว">46 นิ้ว</option>
                                            <option value="48 นิ้ว">48 นิ้ว</option>
                                            <option value="50 นิ้ว">50 นิ้ว</option>
                                            <option value="52 นิ้ว">52 นิ้ว</option>
                                            <option value="54 นิ้ว">54 นิ้ว</option>
                                            <option value="58 นิ้ว">58 นิ้ว</option>
                                        </select>
                                    </label>
                                    </label>
                                    </input>
                                    <br>
                                </p>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="col">
                    <input type="number" id="quafemaleset" name="quafemaleset" class="form-control" value="0" min="0" max="3" onFocus="startCalc2();" onBlur="stopCalc2();">
                </div>
                <div class="col">
                    <input type="text" class="form-control" id="demalesetsum" name="demalesetsum" value="0" readonly></input>
                </div>
            </div>
            <br>
            <div class="row">
                <!-- ROW04 -->
                <div class="col-6">
                    <h3><i class="bi bi-plus"></i> ซื้ออุปกรณ์นักศึกษาเพิ่มเติม</h3>
                </div>
                <div class="col">
                </div>
                <div class="col">
                </div>
            </div>
            <br>
            <!-- รายการที่ 3 -->
            <div class="row">
                <!-- ROW -->
                <div class="col-6">
                    <div class="container">
                        <div class="row">
                            <div class="form-check">
                                <input class="form-check-input" type="checkbox" name="necktie" id="necktie" value="<?php echo ""; ?>"> เทคไท<b>ชาย</b> </input>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col">
                        </div>
                    </div>
                </div>
                <div class="col">
                    <input type="number" id="quanecktie" name="quanecktie" class="form-control" value="0" min="0" max="3">
                </div>
                <div class="col">
                    <input type="text" class="form-control" id="" name="" value="" readonly>
                </div>
            </div>
            <br>
    </div>
    </form>
</body>

</html>

fb1649390008 08-04-2022 19:08

ความคิดเห็นที่ 2

JS.php

<script>
    function startCalc1() {
        interval = setInterval("calc1()", 1);
    }

    function calc1() {
        maleset = document.order.maleset.value;
        quamaleset = document.order.quamaleset.value;

        document.order.emalesetsum.value = (maleset * 1) * (quamaleset * 1) * 160;
    }

    function stopCalc1() {
        clearInterval(interval);
    }
</script>

<script>
    function startCalc2() {
        interval = setInterval("calc2()", 1);
    }

    function calc2() {
        femaleset = document.order.femaleset.value;
        quafemaleset = document.order.quafemaleset.value;

        document.order.demalesetsum.value = (femaleset * 1) * (quafemaleset * 1) * 200;
    }

    function stopCalc2() {
        clearInterval(interval);
    }
</script>

fb1649390008 08-04-2022 19:09

ความคิดเห็นที่ 3

ถ้าค่าที่แสดง แสดงผิดตำแหน่ง อาจจะเป็นี่การอ้างอิง object ของตัวที่จะแสดงไม่ถูกต้อง

document.order.demalesetsum

ตรวจเช็คการนำค่าไปแสดงว่ากำหนดถูกต้องไหม และก็ศึกษาการใช้ addEventListener() แทนการกำหนด setInterval()

ninenik 09-04-2022

ขอบคุณทุกการสนับสนุน

สนับสนุนเว็บไซต์เรา จ่ายด้วย Truemoney Wallet

20 บาท 50 บาท 100 บาท 300 บาท หรือ ระบุจำนวน