Nếu bạn đang sử dụng WordPress và có dùng WooCommerce để làm website bán hàng, thì ít nhiều đã gặp tình trạng Số điện thoại & Email của khách đôi khi không đúng, điền nhầm mà không để ý, dẫn tới việc không thể liên hệ lại với khách được. Nếu sử dụng Website bán hàng tại Việt Nam thì nên kiểm tra SĐT đúng định dạng của Việt Nam thì mới cho đặt hàng, không thì sẽ phải cảnh báo để khách sửa lại.
Dưới đây là đoạn mã code kiểm tra phía client, sử dụng Javascript để kiểm tra đầu vào của số điện thoại và email.




<?php add_action("woocommerce_after_checkout_form", function () { ?> <link href="//cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.min.css" rel="stylesheet"/> <script src="//cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js"></script> <script> jQuery(document).ready(function($){ $(document).on('click', '#place_order', function(e){ /* Bắt sự kiện click tại nút Đặt hàng */ e.preventDefault(); var phone = $('#billing_phone').val(); email = $('#billing_email').val(); if(phone.length > 0 && !vdh_validatePhone(phone)) { /* Validate số điện thoại */ $('#billing_phone').focus() toastr.error("Thông báo", "Số điện thoại không đúng"); return } if(email.length > 0 && !vdh_validateEmail(email)) { /* Validate email */ $('#billing_email').focus() toastr.error("Thông báo", "Email không đúng"); return } $(this).submit() /* Nếu không có lỗi gì thì Submit form */ }) }) function vdh_validatePhone(phone) { /* Function validate đúng số định dạng điện thoại VN */ phone = phone.replace(/\s+/g, ''); // Xóa khoảng trắng const re = /^(0[3|5|7|8|9])[0-9]{8}$/; return re.test(phone); } function vdh_validateEmail(email) { const re = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/; return re.test(email); } </script> <?php }); ?>
Khi số điện thoại và email được điền đúng thì form đặt hàng sẽ được kích hoạt, lúc này sẽ đảm bảo số điện thoại và email không bị sai. Các bạn có thể tham khảo thêm tính năng tích hợp mã QR vào thanh toán đơn hàng tại đây
Bài viết khác
- Plugin PK Live Search Express | Tăng tốc độ tìm kiếm Realtime trong WordPress
- Việt hóa Category Archives trong Flatsome (không cài Plugin)
- [Woocommerce] – Đổi vị trí giá sản phẩm xuống dưới mô tả ngắn
- Download video meme Facebook | Video comment Facebook thú vị, hài hước
- Thêm comment Facebook vào Flatsome WordPress (không cài Plugin)
Bài viết khác
- Thêm thông tin vào dưới trang Check Out Woocommerce
- Hiển thị Email khách hàng khi hoàn tất đơn hàng trong Woocommerce
- Hướng dẫn mua Coin trên sàn Binance (App Mobile)
- CF7 to Google Sheet – Kết nối Contact Form 7 vào Google Sheet (Không Plugin)
- Thêm Tỉnh (Thành) – Quận (Huyện) – Phường (Xã) vào trong Contact Form 7