Question

我正在努力将Bootsrap表单集成到由.NET提供支持的Kentico CMS中。在这样做时，我注意到＆＃34;形式＆＃34;标签正在从我的表单中删除。

我从Kentico支持中收到以下内容 - 我担心ASP.NET WebForms不支持自定义表单标记。问题是在ASP.NET中，整个页面都包含在表单标记中（这是Kentico不特定的标准.NET行为），HTML标准不允许嵌套表单标记。

我有一个用HTML格式的错误处理构建的页面模板，我没有任何.NET编程经验。任何人都可以指出我如何在.NET中正确地使用Bootstrap表单错误处理和提交？

谢谢！

以下是当前的格式：

<form action="" method="post"  id="contact_form">
    <div class="col-md-12">
        <div class="col-md-6 zero-margin-bottom">
            <div class="form-group">
                <label for="Company">Company</label>
                <input name="company" type="company" class="form-control" id="exampleInputCompany" placeholder="Company">
            </div>
            <div class="form-group">
                <label for="FirstName">First Name</label>
                <input name="first_name" type="firstname" class="form-control" id="exampleInputFirstName" placeholder="First Name">
            </div>
            <div class="form-group">
                <label for="LastName">Last Name</label>
                <input name="last_name" type="lastname" class="form-control" id="exampleInputLastName" placeholder="Last Name">
            </div>
        </div>
        <div class="col-md-6 zero-margin-bottom">
            <div class="form-group">
                <label for="exampleInputEmail1">Email address</label>
                <input name="email" type="email" class="form-control" id="exampleInputEmail1" placeholder="Email">
            </div>
            <div class="form-group">
                <label for="exampleInputPassword1">Phone</label>
                <input name="phone" type="phone" class="form-control" id="exampleInputPhome" placeholder="Phone">
            </div>
            <div class="form-group">
                <label for="country">Country</label>
                <select name="country" class="form-control">
                    <option value="">Select Country</option>
                    <option value="Abu Dhabui">Abu Dhabui</option>
                    <option value="...">Afghanistan</option>
                </select>
            </div>
        </div>
        <div class="col-md-12 zero-margin-bottom">
            <div class="form-group">
                <label for="comments">Comments:</label>
                <textarea name="comment" class="form-control" rows="3"></textarea>
            </div>
            <button type="submit" class="btn btn-default submit btn-danger">Send Request</button>
        </div>
    </div>
</form>

Answer 1

Bootstrap验证不依赖于表单标记。它基本上将.has-error类添加到父元素。使用检查器（Chrome中的F12）检查您的标记，并确保男性确定.has-error类已添加到父元素。

Bootstrap包含错误，警告和成功的验证样式表单控件上的状态。要使用，请添加.has-warning，.has-error或 .has-成功到父元素。任何.control-label，.form-control，和该元素中的.help-block将收到验证样式。

查找更多详情here。

Here正在运作。

Answer 2

删除<form>标记，不需要它。如果您的样式依赖于该表单标记，则在包围所有表单元素的div上添加不同的类。默认情况下，您无法使用asp.net webforms开发在<form>中嵌套<form>。 Kentico的门户开发模型正在使用它，每次都会引发问题，因为<form>标签位于文件系统的主页模板上（建议不要修改）。

带有Bootstrap 3.3.5的.NET表单

2 个答案: