Question

我有bootstrap表单和按钮，使用method=post和jquery插件提交数据，该插件使用$('#myform').formValidation验证表单。

按钮和插件都是单独工作的，但是当我将它们一起添加时，验证工作正常，但表单没有提交。我根本没有收到任何消息。

我怀疑插件在某种程度上干扰了bootstrap中的按钮方法，但不知道如何解决它。

这是我的表格：

<form role="form" method="post" action="/addfriend" id="newfriendform">
<div class="container friend">
    <div class="panel panel-default">
        <div class="panel panel-heading">
            <div>
                <h3>Add New Friend</h>
            </div>
        </div>
    <div class="panel panel-body">
    <div class="row">
        <div class="form-group">
            <div class="col-lg-2">  
                <label for="firstname">FirstName</label>
                <input type="text" name="firstname" class="form-control">
            </div>
            <div class="col-lg-2">  
                <label for="middlename">MiddleName</label>
                <input type="text" name="middlename" class="form-control">
            </div>
            <div class="col-lg-2">
                <label for="surname">Surname</label>
                <input type="text" name="surname" class="form-control">
            </div>
    </div>
    <div class="row">
        <div class="form-group">
            <div class="col-lg-12">
                <button class="btn btn-primary">Create Friend</button>
            </div>
        </div>
    </div>
</div>
</form>

我的jquery插件：

   $('#newfriendform').formValidation({
    framework:'bootstrap',
    icon:{
        valid: 'glyphicon glyphicon-ok',
        invalid: 'glyphicon glyphicon-remove',
        validating: 'glyphicon glyphicon-refresh',
    },
    fields:{
        firstname:{
            message:"first name is required",
            validators:{
                notEmpty : {
                    message:"Please provide a firstname"
                },
            }
        },
        surname:{
            message:"surname is required",
            validators:{
                notEmpty : {
                    message:"Please provide a surname"
                },
            }
        },
    }
});

非常感谢任何帮助！

Answer 1

此处显示的按钮类型为submit

<div class="row">
        <div class="form-group">
            <div class="col-lg-12">
                <button type="submit" class="btn btn-primary">Create Friend</button>
            </div>
        </div>
    </div>

Bootstrap：表单提交方法和jquery插件不能一起工作

1 个答案: