MVC Razor field label gets overlapped when copy and paste

Question

<div class="labelled-text-field">
     @Html.LabelFor(x => x.Email)
     @Html.TextBoxFor(x => x.Email)
     @Html.ValidationMessageFor(x => x.Email)
</div>

When using right click -> paste label gets overlapped with the pasted email:

When typing or using Ctrl+v (paste) work well:

I dont know if using a razor oncopy event is the way to fix this:

@Html.TextBoxFor(x => x.Email, 
              new { 
                    @class = "input_box", 
                    id = "txtDays", 
                    onpaste="" 
                  }
               ) 

Answer 1

Try the placeholder attribute. It will clear the watermark when you paste the text.

<div class="labelled-text-field">
    @Html.LabelFor(x => x.Email)
    @Html.TextBoxFor(x => x.Email, new {placeholder="Your Email" })
    @Html.ValidationMessageFor(x => x.Email)
</div>