Question

我需要将Telerik密码强度检查器添加到密码字段（Telerik RadTextBox），但是当我这样做时，将宽度限制为60px，我无法理解。

RadTextBox代码如下所示：

<telerik:RadTextBox TextMode="Password" ID="rtb_NewPassword" 
    CssClass="RegisterTextbox" style="width:150px;" Runat="server" 
    LabelWidth="160px" Wrap="False">
</telerik:RadTextBox>

所以当我添加力量检查器时，它看起来像这样：

<telerik:RadTextBox TextMode="Password" ID="rtb_NewPassword" 
    CssClass="RegisterTextbox" style="width:150px;" Runat="server" 
    LabelWidth="160px" Wrap="False">
    <PasswordStrengthSettings ShowIndicator="true" PreferredPasswordLength="6"
        MinimumNumericCharacters="1" MinimumUpperCaseCharacters="1"
        MinimumLowerCaseCharacters="1" CalculationWeightings="50;15;15;20"
        IndicatorElementID="spn_StrengthIndicator"></PasswordStrengthSettings>
</telerik:RadTextBox>

呈现的HTML如下：

没有力量检查器：

<span id="ExternalLogin_rtb_NewPassword_wrapper" class="riSingle RadInput
    RadInput_Glow" style="width:160px;">
    <input id="ExternalLogin_rtb_NewPassword" name="ExternalLogin$rtb_NewPassword"
        size="20" class="riTextBox riEnabled RegisterTextbox" type="password" />
    <input id="ExternalLogin_rtb_NewPassword_ClientState"
        name="ExternalLogin_rtb_NewPassword_ClientState" type="hidden" />
</span>

使用力量检查器:(注意宽度为60px的范围）

<span id="ExternalLogin_rtb_NewPassword_wrapper" class="riSingle RadInput
    RadInput_Glow" style="width:160px;">
    <span class="riContentWrapper" style="width:60px;">
        <input id="ExternalLogin_rtb_NewPassword" name="ExternalLogin$rtb_NewPassword"
            size="20" class="riTextBox riEnabled RegisterTextbox" type="password" />
        <input id="ExternalLogin_rtb_NewPassword_ClientState"
            name="ExternalLogin_rtb_NewPassword_ClientState" type="hidden" />
    </span>
</span>

我无法在定义此代码的代码或属性中看到任何地方。它只是在页面构建时出现。

无论如何都要阻止这种情况发生？

由于

Answer 1

尝试使用CSS覆盖

.riContentWrapper
{
width:100px !important;
}

Answer 2

我明白了。

我需要将EnableSingleInputRendering属性更改为False。

真的很明显！（不）

向RadTextBox添加密码强度指示符会截断宽度

2 个答案: