ปลั๊กอิน 2C2P WooCommerce ใช้ไม่ได้ แก้ยังไง [2C2P Redirect API for WooCommerce]

ปลั๊กอิน 2C2P WooCommerce ใช้ไม่ได้ แก้ยังไง [2C2P Redirect API for WooCommerce]

เริ่มจากโจทย์… เชื่อมเว็บขายของ E-Commerce กับ 2c2p

พอดีผมมีงานทำเว็บไซต์ขายของออนไลน์ WooCommerce & WordPress เข้ามางานนึง ซึ่งลูกค้าใช้ Payment Gateway ของ 2C2P ครับ โดยผมได้มีการประสานงานกับทีมไอทีเรียบร้อยครับ

โดยที่ทาง 2C2P ให้แจ้งมาว่า หากใช้ WooCommerce สามารถใช้ Plugin สำเร็จรูปได้เลย โดยใช้ Link นี้ครับ

ปลั๊กอิน 2C2P WooCommerce ใช้ไม่ได้ แก้ยังไง [2C2P Redirect API for WooCommerce]
ปลั๊กอิน 2c2p สำหรับเว็บขายของออนไลน์ที่ใช้ WooCommerce สำเร็จรูปจากทาง 2c2p
https://wordpress.org/plugins/2c2p-redirect-api-for-woocommerce/

โดยที่ผมเอามาลงครับ พอทดสอบการใช้งานเท่านั้นแหละครับ พัง!

เอ๊ะ เว็บผมก็ปกตินะ ปลั๊กอินก็ใช้น้อยมาก ทำไมถึงพัง

ผมลองเช็ค Error log จาก console (F12) ดูครับ ว่าเกิดอะไรขึ้น เลยอ๋อเลยครับ

ใน Console แจ้งว่า

Uncaught TypeError: $(…).live is not a function
at HTMLDocument. (wc-2c2p-script.is:4)

ผมเลยเข้าไปเช็คเว็บของ Plugin ครับ ว่าทำไม

Plugin ตัวนี้ UPDATE ครั้งสุดท้าย 5 ปีแล้วครับ (นับจากวันที่เขียนบทความนี้ น่าจะ 2017 ครับ)

ปลั๊กอิน 2C2P WooCommerce ใช้ไม่ได้ แก้ยังไง [2C2P Redirect API for WooCommerce]
Plugin 2c2p ไม่อัพเดทเลย

ในเมื่อเขาไม่แก้ ผมก็แก้เองครับ

วิธีแก้

หากเข้าแก้ไขไฟล์ 2c2p-redirect-api-for-woocommerce/Includes/wc-2c2p-script.js แล้ว จะสังเกตแถวที่ 4 และ 15 ครับ

ถ้าอ่านตาม Error Log ด้านบนนั่นคือ ในโค้ดมีฟังค์ชั่น .live() ที่เก่าแล้วครับ โดยปัจจุบันฟังค์ชั่นี้ถูกลบไปแล้วใน JQuery เวอร์ชั่นใหม่

โดยปัจจุบันใช้เป็น .on() แทนครับ

โค้ดต้นฉบับ

jQuery(document).ready(function($) {

    //Hide remove button when user select first option from dropdown (l'll use my new card)
    $('#wc_2c2p_stored_card').live('change', function() {
        var value = $('#wc_2c2p_stored_card').val();

        if (value === "0") {
            $('#btn_2c2p_remove').hide();
        } else {
            $('#btn_2c2p_remove').show();
        }
    });

    //Button click event
    $('#btn_2c2p_remove').live('click', function() {
		if($("#wc_2c2p_stored_card").val() === "0"){
			alert("Please select card number to delete.");
			return;
		}

เวอร์ชั่นที่แก้ไขแล้ว

jQuery(document).ready(function($) {

    //Hide remove button when user select first option from dropdown (l'll use my new card)
    $('#wc_2c2p_stored_card').on('change', function() {
        var value = $('#wc_2c2p_stored_card').val();

        if (value === "0") {
            $('#btn_2c2p_remove').hide();
        } else {
            $('#btn_2c2p_remove').show();
        }
    });

    //Button click event
    $('#btn_2c2p_remove').on('click', function() {
		if($("#wc_2c2p_stored_card").val() === "0"){
			alert("Please select card number to delete.");
			return;
		}

เผื่อมือใหม่งง ทำตาม GIF นี้ได้เลยครับ ไม่ต้องกลัวพัง

ปลั๊กอิน 2C2P WooCommerce ใช้ไม่ได้ แก้ยังไง [2C2P Redirect API for WooCommerce]

ทำทั้งหมดเสร็จแล้วกด Save ได้เลยครับ

สุดท้ายนี้ ผมใจลึก ๆ ก็อยากให้ทาง 2C2P เล็งเห็นว่า WooCommerce เป็น E-Commerce System ที่เป็นที่แพร่หลายมาก ๆ ครับ อยากให้ทางผู้พัฒนาแก้ไขปัญหานี้ เพื่อให้ผู้ใช้หรือ Developer ปิดงานได้ง่ายขึ้นครับ ขยายฐานลูกค้าฝั่ง WooCommerce ให้มากขึ้นครับ 😂

เวิร์คหรือไม่เวิร์ค ทิ้งความเห็นไว้ได้เลยนะครับ

ใส่ความเห็น

อีเมลของคุณจะไม่แสดงให้คนอื่นเห็น ช่องข้อมูลจำเป็นถูกทำเครื่องหมาย *