使用带有两个提交按钮的Jquery验证表单

时间:2011-04-26 14:55:09

标签: jquery jquery-plugins jquery-validate

我有一个表单,有2个提交按钮,有3个文本框。在按钮上文本框1应该验证并且n提交按钮B,其他2应该验证。我使用了提交处理程序并使用ajax提交表单。

我的问题是,如果我点击A然后如果点击B则不会调用B的提交处理程序。无论先点击什么,其他方法都无效。

请帮忙!

我的代码如下所示:

function set_new_rate(oid) {
    alert("set_new_rate");
    $("#TestForm").validate({
        event: "custom",
        rules: {
            client_new_rate: {
                required: true,
                number: true
            },
            agent_new_rate: {
                required: true,
                number: true
            }
        },
        messages: {
            client_new_rate: {
                required: "Required",
                number: "Invalid Rate"
            },
            agent_new_rate: {
                required: "Required",
                number: "Invalid Rate"
            }
        },
        submitHandler: function() {
            var client_new_rate = $('#client_new_rate').val();
            var agent_new_rate = $('#agent_new_rate').val();

            var answer = confirm("Set New Rate for this Order?")
            if (answer)
            {
                $.post('http://localhost/fc/index.php/disp/set_new_rate/',{order_id:oid,client_new_rate:client_new_rate,agent_new_rate:agent_new_rate},function(data){
                    if(data==1)
                    {
                        $('#rateupdated').html('<div id="display_message" class="msg msg-ok" style="margin:0 0 5px 0px;width:180px;"><p>Rate Updated Successfully!</p></div>');
                        $("#rateupdated").fadeIn(0).fadeOut(5000);
                        $('#rec_ord_cnt_prc'+oid).html(client_new_rate);
                        $('#client_old_rate').html(client_new_rate);
                        $('#agent_old_rate').html(agent_new_rate);
                        $('#client_new_rate').val('');
                        $('#agent_new_rate').val('');
                    }
                });
            }
        }
    });
}

function add_note(oid) 
{
    alert("add_note");

    $("#TestForm").validate({
        event: "custom",
        rules: {
            note_description: {
                required: true
            }
        },
        messages: {
            note_description: {
                required: "Required"
            }
        },
        submitHandler: function() {
            alert("add_note _ sh");
            var note_description = $('#note_description').val();
            var note_type = $('input:radio[name=note_type]:checked').val();
            var answer = confirm("Add this "+note_type+" Note?")
            if (answer)
            {
                $.post('http://localhost/fc/index.php/disp/add_note/',{order_id:oid,note_description:note_description,note_type:note_type},function(data){
                    if(data==1)
                    {
                        $('#noteadded').html('<div id="display_message" class="msg msg-ok" style="margin:5px 5px 5px 0px;width:282px;"><p>Note Added Successfully!</p></div>');
                        $('#note_description').val('');
                        $("#noteadded").fadeIn(0).fadeOut(5000);
                    }                            
                });
            }
        }
    });
}

我正在使用Jquery Validate Plugin。

1 个答案:

答案 0 :(得分:0)

如何使用内置事件句柄的jquery而不是submitHandler调用。

$('.MyForm .set_rate').click(function(e){
   set_new_rate(oid);
   //here your submitHandler call function
});

$('.MyForm .add_note').click(function(e){
   add_note(oid);
   //here your submitHandler call function
});

(我试图复制该函数,但textarea给了我错误。在你的函数中,只是在两种情况下都删除了submitHandler。