使用ajax提交表单验证时会被忽略

时间:2014-12-28 16:47:22

标签: javascript php jquery ajax forms

我的页面中有这个javascript函数。

$(document).ready(function(){
    $('input[type="radio"]').click(function(){
        if($(this).attr("value")=="InfiStallStock"){
            $(".e-stock-saldo-box").hide();
            $(".InfiStall ul li .infistallLocation").attr('required');              
            $(".Delivery ul input:radio").removeAttr('required');
            $(".Delivery ul input:text").removeAttr('required');
            $(".InfiStall").show();
        }
        if($(this).attr("value")=="DeliveryStock"){
            $(".e-stock-saldo-box").hide();
            $(".InfiStall ul li .infistallLocation").removeAttr('required');
            $(".Delivery ul li input:radio").attr('required');
            $(".Delivery ul input:text").attr('required');
            $(".Delivery").show();
        }
    });
});  


            function enableList(element) {
                var select = document.getElementById("select"+element.id.substring(element.id.length-9));
                enableSubmit();
                showUp();                    
                if(element.checked === true){
                    select.disabled = false;
                    checkSelect(select);
                }else{
                    select.disabled = true;
                    select.selectedIndex = 0;
                }
            }
            function checkSelect(element){
                if(!validate_select(element)){
                    element.setCustomValidity("Pilih Jumlah Estock");
                }else{
                    element.setCustomValidity("");
                }
            }

这个javascript用于检查用户选择哪个选项。如果用户选择一个选项,则将忽略/删除另一个需要输入的选项,反之亦然。

如果我直接使用<form action="submit.php"/>等表单操作提交表单,则javascript在验证表单方面效果很好。

但是,当我改变现在使用ajax提交它的方式时,将忽略验证。

以下是提交表单的ajax脚本:

$('#btn_submit').on('click', function(e) {
    e.preventDefault();

    var esquantity = $('.row_selected select').map(function() { return $(this).val(); }).get().join('|');
    var size = $('.row_selected td.size span').map(function() { return $(this).text(); }).get().join('|');

    $.ajax(
    {
        type: "POST",
        url: "../ajax.php",
        data: 'esquantity='+esquantity+ '&size='+ size,
        cache: false,
        success:function(html)
        {
            alert("Succes " + html);
        }
    });

任何人都可以帮我解决这个问题,所以即使我用ajax提交它,这个表格也会有一些验证。谢谢!

1 个答案:

答案 0 :(得分:0)

尝试 -

在正常按钮上而不是在提交按钮上写下此事件

$('#btn_submit').on('click', function(e) {

这将要求您不要调用

e.preventDefault();

在函数中,你可以做的是在ajax调用的回调区域中显式调用submit()函数,即

success:function(html)
{
    // call submit function explicitly it should validate all your constraints then
}