相关疑难解决方法(0)

我正在尝试通过Bootstrap激活验证,我已经粘贴在我页面上的follownig示例中.

<div class="form-group has-success">
  <label class="form-control-label" for="inputSuccess1">Input with success</label>
  <input type="text" class="form-control form-control-success" id="inputSuccess1">
  <div class="form-control-feedback">Success! You've done it.</div>
  <small class="form-text text-muted">Example help text that remains unchanged.</small>
</div>

我可以看到输入控件的外观已经改变(它现在有点圆润,更美观)但它仍然没有显示绿色边框,如链接到的页面上所示.我正在链接的Bootstrap指出如下.

<link rel="stylesheet"
      href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" />

试图解决这个问题,我只得到了一些链接到官方网站的例子,我从那里得到了我的样本,所以在那里帮助我很少.我有一个小提琴来说明这个问题.

我能做些什么呢？我错过了什么？

我使用bootstrap 3的网格系统来布局一个简单的注册表单.但是,如果Rails中的验证失败,添加了类"field_with_errors"的div会弄乱我的布局.

以下是我的表单中的一行通常如下所示:

<div class="form-group">
    <label class="col-xs-2 control-label" for="user_secondary_email">Secondary email</label>
    <div class="col-xs-4">
    <input class="form-control" id="user_secondary_email" name="user[secondary_email]" type="text" />
    </div>
</div>

验证失败时,当前应用的样式如下所示:

<div class="form-group">
    <div class="field_with_errors"><label class="col-xs-2 control-label" for="user_primary_email">Primary email</label></div>
    <div class="col-xs-4">
        <div class="field_with_errors"><input class="form-control" id="user_primary_email" name="user[primary_email]" type="text" value="" /></div>
    </div>
</div>

我做了一些研究,据我所知,这是代码应该是这样的:

<div class="form-group has-error">
        <label class="col-xs-2 control-label" for="user_secondary_number">Secondary number</label>
        <div class="col-xs-4">
            <input class="form-control" id="user_secondary_number" name="user[secondary_number]" type="text" />
        </div>
   </div>

我不明白的是如何让应用程序将其他类添加到正确的html标记中？

任何帮助表示赞赏!