【问题标题】:two button in bootstrap form validation引导表单验证中的两个按钮
【发布时间】:2016-05-18 03:51:26
【问题描述】:

我正在使用引导表单验证进行表单验证。我有两个特定形式的按钮,一个是确认按钮,另一个是提交按钮。我想阻止提交确认按钮并将其用作验证按钮。如果表单填写正确,另一个按钮仅用于提交。如果表单被接受,确认按钮将会淡出。

<form method="post" action="">
    <input type="text" name="name">
    <input type="text" name="name">
    <input type="submit" name="confirm" value="Confirm">
    <input type="submit" name="submit" value="Submit">
</form>

如果我在确认按钮上使用“按钮”类型,它将不会验证表单。如果有人有任何想法,请回答。非常感谢您的回答。

【问题讨论】:

  • 您需要在该确认按钮上添加一个事件以进行点击,并且在点击内您必须验证表单..
  • 让它变得简单。禁用提交按钮,直到表单验证。否则,如果您想以这种方式进行操作,只需使用您的确认按钮绑定和事件。对于前-。 button.addEventListener('click, function(){ // 在这里做你的事情。});
  • 谢谢@Reddy 你能给我一些代码吗?
  • 感谢@Gitesh Purbia 有意义。我会尝试按照您的建议进行操作,如果有任何问题,我会更新我的问题。非常感谢
  • 你用哪个插件来验证???

标签: javascript jquery twitter-bootstrap validation formvalidation.io


【解决方案1】:

我将第一个按钮的元素从输入更改为按钮。

<form method="post" action="">
  <input type="text" name="name">
  <input type="text" name="name">
  <button name="confirm" type="button">Confirm</button>
  <input type="submit" name="submit" value="Submit">
</form>

【讨论】:

  • 我认为以下答案不起作用,因为引导表单验证不适用于 type="button"。我已经测试过一个。感谢您的回答。
【解决方案2】:

为确认按钮和表单提供一个 id。我已经对此进行了测试,并且可以正常工作。

<form method="post" action="" id="myform">
    <input type="text" name="name">
    <input type="text" name="name">
    <input type="submit" name="confirm" value="Confirm" id="confirmbutton">
    <input type="submit" name="submit" value="Submit">
</form>

在 jQuery 中

<script>
$( document ).ready(function() {

$('#myform').submit(function(event){
    var btn = $(this).find("input[type=submit]:focus" ).attr("id");
    console.log(btn);
    if(btn=="confirmbutton")
    event.preventDefault();

});
}); 
</script>

【讨论】:

    猜你喜欢
    • 2014-09-28
    • 2013-02-16
    • 2019-11-30
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-11-18
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多