如何防止使用空字段提交Foxycart動作？

Question

Hollo全部，

我正在創建一個表單，該表單將數據提交給一個名爲Foxycart的電子商務解決方案。我希望表單只在輸入日期字段時進入foxycart，但它當前僅顯示警報消息，然後繼續執行表單上的操作。有沒有人有如何防止提交行動的建議？請看下面的代碼：

<script> 
function validateForm() { 
    var x = document.forms["delivery-date-info"]["Delivery_Date_is"].value; 
    if (x == null || x == "") { 
     alert("Date must be filled out"); 
     return false; 
    } 
} 
</script> 



<form name="delivery-date-info" action="https://austin-roman.foxycart.com/cart" method="post" accept-charset="utf-8" onsubmit="return validateForm()"> 

      <div class="add-to-bag"> 
       <label for="datepicker-example3"></label> 
       <input id="datepicker-example3" type="text" name="Delivery_Date_is"> 
       <input type="submit" id="datepicker-example3" type="text" class="button-add"> 

      </div> 
      </form> 

Answer 1

假設你正在使用FoxyCart的默認「sidecart」的方式（如2.0版），你需要使用FoxyCart自己的事件系統，described here。爲了您的具體的例子，它可能是這樣的：

var FC = FC || {}; 
FC.onLoad = function() { 
    FC.client.on('cart-submit', function(params, next) { 
     if (validateForm()) { 
      next(); 
     } 
    }); 
}; 

function validateForm() { 
    var x = document.forms["delivery-date-info"]["Delivery_Date_is"].value; 
    if (x == null || x == "") { 
     alert("Date must be filled out"); 
     return false; 
    } else { 
     return true; 
    } 
} 

這裏有一個替代的辦法，會更靈活一些，可以讓每頁以上的產品形式，也說明多一點這是怎麼回事：

var FC = FC || {}; 
FC.onLoad = function() { 
    FC.client.on('cart-submit', function(params, next) { 
     $element = $(params.element); 
     if (
      $element.attr('name') == 'delivery-date-info' 
      && $element.find('[name="Delivery_Date_is"]').length > 0 
      && !$element.find('[name="Delivery_Date_is"]').val() 
     ) { 
      alert('Date must be filled out'); 
     } else { 
      next(); 
     } 
    }); 
};