如何将两个按钮组合成一个?

时间:2016-04-29 13:48:18

标签: javascript jquery forms

我有以下两个按钮:

<button type="submit" id="gform_submit_button_1">Submit</button>

<button type="button" data-is_quote="1" data-button="simple_add_to_quote" data-product-type="simple" data-product-id="75448" id="add_to_quote">Submit</button>

#gform_submit_button_1按钮在向服务器提交数据之前验证表单条目

并且#add_to_quote按钮提交表单数据而不验证它

我希望能够验证表单和表格。使用#add_to_quote按钮提交。任何解决方案?

4 个答案:

答案 0 :(得分:0)

点击add_to_quote时触发gform_submit_button_1按钮的点击事件。

$("#add_to_quote").click(function() {
   $("#gform_submit_button_1").click();
});

答案 1 :(得分:0)

我不确定我是否解决了问题,但这是一个可能的解决方案: 使用包含所有data-X值的隐藏输入和提交表单的提交按钮创建一个表单元素。

<form method="GET/POST" action="validation.php">
   <input type="hidden" name="data-validation" data-is_quote="1" data-button="simple_add_to_quote" data-product-type="simple" data-product-id="75448" id="add_to_quote">
   <input type="submit" value="submit" id="add_to_quote">
</form>

我希望它会有所帮助!

答案 2 :(得分:0)

@Dhara Parmar解决方案很好......但是错过了event.stopPropagation()event.preventDefault()这样:

$("#add_to_quote").click(function() {
   $(this).preventDefault(); //to stop submit
   $(this).stopPropagation();//to avoid the event bubbling up to other submit buttons, if any...
   $("#gform_submit_button_1").click();
});

答案 3 :(得分:0)

您可以直接从 type = button 点击处理程序调用表单的验证和提交功能,使其行为类似 type = submit

$("#add_to_quote").click(function () {
    if (!$("#TheForm").validate()) { //native validation triggered
        return false;
    } else {
        $("#TheForm").submit()
    }
});