[英]Display a sweet alert on Ajax Woocommerce Add To Cart Validation
[英]Woocommerce add to cart validation hide alert message
我有woocommerce,單一產品頁面,有兩種變體的變體產品。 如果其中一些(或沒有)未選中,則添加到購物車按鈕將被禁用,並且我會收到一條帶有消息的警報。 據我了解,它是一個函數woocommerce_add_to_cart_validation 。 我需要禁用警報消息並在購物車數量和添加到購物車按鈕之前顯示此錯誤消息。 據我了解,這是一個woocommerce_before_add_to_cart_button 。 我怎樣才能做到這一點?
我找到了一些關於如何自定義行為的解決方案,但我沒有找到如何隱藏警報消息。
更新
我說的是當您按下“添加到購物車”按鈕但變體形式無效時出現的 JS 警報。 例如,我有一個帶有尺寸和顏色的產品。 我選了顏色但忘了選尺碼。 添加到購物車按鈕被禁用,如果我按下它,JS 警報會與消息一起出現,我需要完成表單。 我想隱藏這個 JS 警報彈出窗口並在 add_to_cart_button 塊之前放置自定義錯誤消息。
我進一步調查了這個問題,發現這個警報來自/woocommerce/assets/js/frontend/add-to-cart-variation.js
我找到了這個功能
VariationForm.prototype.onAddToCart = function( event ) {
if ( $( this ).is('.disabled') ) {
event.preventDefault();
if ( $( this ).is('.wc-variation-is-unavailable') ) {
window.alert( wc_add_to_cart_variation_params.i18n_unavailable_text );
} else if ( $( this ).is('.wc-variation-selection-needed') ) {
window.alert( wc_add_to_cart_variation_params.i18n_make_a_selection_text );
}
}
};
第二個是當前警報。 所以我決定不重寫這個原型,而是使用更簡單的解決方案。 我已經在單個產品的元位置有一個自定義表單。
<script type="text/javascript">
jQuery( function($){
$( '<span id="show_error">Please, fill all options!</span>' ).insertBefore( ".single_variation_wrap" );
$('#show_error').hide();
...........
$('.single_add_to_cart_button').on('click',function(e){
if ( $( this ).is('.disabled') ) {
e.preventDefault();
if ( $( this ).is('.wc-variation-selection-needed') ) {
$('#show_error').show();
setTimeout(function () {
$('#show_error').hide();
}, 3000);
return false;
}
}
});
});
</script>
所以我為錯誤消息添加了自定義跨度塊,現在,如果我忘記填寫表單中的所有選項,錯誤消息會顯示三秒鍾。 這不是最好的解決方案,但效果很好!
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.