如何防止Foxycart Action提交空字段?

时间:2015-04-24 01:36:03

标签: javascript forms submit field action

Hollo All,

我正在创建一个表单,将提交的数据导出到名为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>

1 个答案:

答案 0 :(得分:0)

假设您正在使用FoxyCart的默认&#34; sidecart&#34;方法(从v2.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();
        }
    });
};