【问题标题】:Confirm password validation using material design lite errors使用 Material Design lite 错误确认密码验证
【发布时间】:2016-09-27 06:52:51
【问题描述】:

我目前正在使用 Google 的 Material Design lite 创建网页,但在密码不匹配时将确认密码文本框更改为无效所需的必要更改遇到了障碍。因此,如果密码不匹配,则会生成样式 mdl-textfield__error 样式的错误。

我如何使用 MDL 实现这一点?

<tr>
    <td>
        <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
            <form:input path="password" type="password" class="mdl-textfield__input" id="password" required="true" pattern=""  />
            <label class="mdl-textfield__label" for="email">Password</label>
            <span class="mdl-textfield__error"> Input must not be empty</span>
        </div>
    </td>
</tr>
<tr>
    <td>
        <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
            <input path="password" type="password" class="mdl-textfield__input" id="password" required pattern=""  />
            <label class="mdl-textfield__label" for="email">Confirm Password</label>
            <span class="mdl-textfield__error"> Input must be equal to password</span>
        </div>
    </td>
</tr>

【问题讨论】:

    标签: javascript jquery html validation material-design


    【解决方案1】:

    如果您的问题是关于如何动态应用样式,请为两个密码字段指定不同的 ID,例如 password1 和 passoword2,并在 jquery 中使用以下代码来指定样式。

    $("#password2").parent().addClass('is-invalid');
    

    同时删除无效样式将涉及使用 removeClass 函数。

    我从这个 url https://github.com/google/material-design-lite/issues/1502b2550 的评论中得到了这个想法

    【讨论】:

      猜你喜欢
      • 2017-12-19
      • 2020-08-06
      • 2016-10-18
      • 2021-04-15
      • 1970-01-01
      • 1970-01-01
      • 2013-09-18
      • 2015-04-03
      • 2023-02-23
      相关资源
      最近更新 更多