社群 學習 工具庫 休閒
搜尋
繁体中文
Bootstrap 5 驗證訊息未顯示
P粉391677921
P粉391677921 2023-09-06 08:53:55
0
1
631
<p>我有一個使用 Bootstrap 5.1.0 的 Blazor 網頁，其形式如下，驗證純粹是客戶端：</p> 

    >

    <div class=“行g-3”>

        <div class="col-sm-6">
            <標籤=“firstName” class=“form-label”>名字
            >
            <div class="無效回饋">
                需要有效的名字。
<div data-lastpass-icon-root=“true” style="位置：相對！重要；高度：0px！重要；寬度：0px！重要；浮動：左！重要;>></div>
<div class="col-sm-6"> <標籤=“lastName” class=“form-label”>姓氏 > <div class="無效回饋"> 需要有效的姓氏。
<hr class="my-4"> <按鈕id=“提交” class＝“w-100 btn btn-primary btn-lg” type=「提交」>進行安全付款 </EditForm></pre> <p>每次我看到提交表單時，這就是我的驗證知識的內容：</p> <p>如果我檢查包含無效回饋類別的 div，它會被設定為 <code>display:none</code>，因此不會顯示。</p> <p>我在互聯網上搜索，試圖找到一種顯示驗證訊息的方法，但無濟於事。有些人建議將 d-block 類別放在 div 上，但如果我這樣做，驗證訊息將永久顯示。< /p> <p>當表單以空值提交時，如何讓驗證訊息顯示在輸入下方，如下圖：</p>
1
0
0
P粉391677921
P粉391677921

全部回覆(1)
P粉032649413
P粉0326494132023-09-07 00:10:29 1樓

答案是新增 ValidationMessage 元件，如下所示：

<div class="col-sm-6">
        <label for="firstName" class="form-label">First name</label>
        <InputText type="text" @bind-Value="CheckoutViewModel.FirstName" class="form-control" id="firstName" />
        <ValidationMessage For="@(() => CheckoutViewModel.FirstName)" />            
    </div>
點贊 +0
新增回覆
熱門專題
更多>
熱門文章
熱門教學
更多>
相關教學
熱門推薦
最新課程
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板