Skip to content

Commit

Permalink
#951 [HxInputDate] Floating label test
Browse files Browse the repository at this point in the history
  • Loading branch information
hakenr committed Nov 26, 2024
1 parent 4b52fca commit 8aa6521
Showing 1 changed file with 10 additions and 0 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
@page "/HxInputDate_FloatingLabel"
@rendermode InteractiveServer

<div class="col-lg-3">
<HxInputDate Label="Date" @bind-Value="@value" LabelType="LabelType.Floating" CalendarIcon="BootstrapIcon.Calendar" />
</div>

@code {
public DateTime value { get; set; }
}

3 comments on commit 8aa6521

@mmonteagudo
Copy link
Contributor

@mmonteagudo mmonteagudo commented on 8aa6521 Nov 26, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Interesting ...
I do not have any special code, almost same as you, I attached an screenshot, the only difference is, I'm not setting the LabelType property, as I'm using the InputDefault as floating for the whole app (screenshot attached)

Code to Setup defaults:

public static void Setup()
{
    HxSetup.Defaults.LabelType = LabelType.Floating;
    HxInputBase.Defaults.ValidationMessageMode = ValidationMessageMode.Regular;
}

Code in the Razor page

<div class="row">
    <div class="col">
        <HxInputDate Label="Start Date" @bind-Value="@schoolYear.StartDate" CalendarIcon="BootstrapIcon.Calendar" />
    </div>
    <div class="col">
        <HxInputDate Label="Start Date" @bind-Value="@schoolYear.EndDate" CalendarIcon="BootstrapIcon.Calendar" />
    </div>
</div>

Image

Image

@mmonteagudo
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actually, that's actually the reason, I ran a test and added the LabelType property directly into the HxInputDate and the double label disappeared, look at the example screenshot and the code:

Image
Image

@mmonteagudo
Copy link
Contributor

@mmonteagudo mmonteagudo commented on 8aa6521 Nov 26, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Also happens even using the InputDate defaults:
Image

Image

Please sign in to comment.