สอบถามการนำข้อมูลจากการ append ไปใส่ในตัว carousel (ต่อจากกระทู้ที่เเล้ว)

ถาม-ตอบ แนะนำไอเดียว โค้ดตัวอย่าง แนวทาง วิธีแก้ปัญหา สอบถามการนำข้อมูลจากการ append ไปใส่ในตัว carousel (ต่อจากกระทู้ที่เเล้ว)

สอบถามการนำข้อมูลจากการ append ไปใส่ในตัว carousel (ต่อจากกระทู้ที่เเล้ว)
หลังจากผมได้มีการกำหนด DOM Element ให้เสร็จก่อนที่จะเข้าไปใช้ตัว plugin ของ carousel ปรากฏว่า เมื่อมีการ click ปุ่มส่งค่าครั้งเเรก ตัว carousel สามารถทำงานได้อย่างปกติครับ เเต่เมื่อผมทำการกดให้มีการส่งค่าเป็นครั้ง ที่ 2 ตัว carousel กลับไม่ทำงาน ต้องเเก้ไขอย่างไรครับ process การทำงานทั้งหมด จะไม่มีการ รีเฟส หน้าจอนะครับ จะใช้เป็นตัว jquery กับ javascript ในการดพเนินงาน

ไฟล์หน้า index
<div id="divBuy" class="hide fadeInRight ">  
    <div class="sticky-top sticky-buyer p-1" style="background: #ffffff;"> 
        <button type="button" class="close" aria-label="Close" onclick="$('#divBuy').toggle();">
            <span aria-hidden="true">&times;</span>
        </button> 
    </div> 
    <div class=""> 
        <?php
        include("popup.php");
        ?>
    </div> 
</div>


<ul class="nav flex-column">
    <li class=""> 
        <a class="" onclick="byg_replace(m_<?php echo $v['ID']; ?>);$('#divBuy').toggle();">
<i class="fas fa-buy"></i><br> Detail</a>
    </li>
</ul>

//ผมได้นำค่า json_encode เก็บไว้ที่ตัวเเปร m_ นะครับ
<script>
    function byg_replace(data) {
        var md = data;
        var i;
        $(".owl-carousel.sec").html('');
        var txt = "";
        for (i = 0; i < md.mod.length; i++) {
            var mv = md.mod[i];
            var txt = ' <div class="item news-post standard-post">
<div class="d-flex flex-row w-100 pb-0"><img src="' + mv.pic + '" > </div></div>';
            $('.owl-carousel.sec').append(txt);
        }

        $('.owl-carousel').owlCarousel({
            loop: true,
            margin: 10,
            nav: false,
            autoplay: true,
            autoplayTimeout: 2000,
            autoplayHoverPause: true,
            responsive: {
                0: {
                    items: 1
                },
                600: {
                    items: 3
                },
                1000: {
                    items: 5
                }
            }
        });
    }
</script>

ไฟล์หน้า popup

<div class="owl-carousel sec">

</div>




Antinew007 22-09-2020 23:01:41

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

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


  • ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ
  • เปลี่ยน


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

 ความคิดเห็นที่ 1
คลิกขวาดูโค้ดแนวทางจาก demo คำถามที่แล้ว


ninenik 23-09-2020






เว็บไซต์ของเราให้บริการเนื้อหาบทความสำหรับนักพัฒนา โดยพึ่งพารายได้เล็กน้อยจากการแสดงโฆษณา โปรดสนับสนุนเว็บไซต์ของเราด้วยการปิดการใช้งานตัวปิดกั้นโฆษณา (Disable Ads Blocker) ขอบคุณครับ