input type="date" changed to type="text"

[juchunwei]

Hello,

I'm using abp4.2 MVC Razor template. I setup the input element with type="date", but I changed to type="text" when I run the page. Why like this? how can I avoid this?

Thanks!

[maliming]

• Steps needed to reproduce the problem.

[juchunwei]

@maliming ,
Here're the code in the page. When I open the page, the input changed to <input type="text" class="form-control"> and seems it's using the datepickier.

<abp-card>
<abp-card-body>
<form method="post">
<input type="date" class="form-control" />
</form>
</abp-card-body>
</abp-card>

[juchunwei]

@maliming
Sorry, the code disappeared.
Here're the code

</abp-card-body>

[juchunwei]

<abp-card>
<abp-card-body>
<input type="date" class="form-control" />
</abp-card-body>
</abp-card>

[yekalkan]

@juchunwei

#7196 (comment) may this help you?

[juchunwei]

@yekalkan
that doesn't work either, that's what I tried the first time, it's changed to type="text", then I tried to use the input element directly without the abp-input, and get the same result. the code changed to <input type="text" class="form-control">

[yekalkan]

As you said, this is not a behaviour of Abp Framework.

[juchunwei]

@yekalkan
Not sure what's wrong. But I tried to use <input type="date" class="form-control"/> without abp, it works. not changed to type="text"

[yekalkan]

AspNet Core Input tag helper converts it to text. Therefore abp-input converts as well.

[juchunwei]

@yekalkan

I just created a complete new project with the standard Microsoft template. here're the code, and no problems.

` public class IndexModel : PageModel
{
private readonly ILogger _logger;

    public IndexModel(ILogger<IndexModel> logger)
    {
        _logger = logger;
    }
    public void OnGet()
    {

    }

    [BindProperty]
    public TestModel MyModel { get; set; } = new TestModel();
   
    public class TestModel
    {
        [DataType(DataType.Date)]
        public DateTime Date { get; set; }
    }
}`

<div class="text-center">
<div style="width:300px">
<input type="date" class="form-control" />
<input class="form-control" asp-for="MyModel.Date" />
</div>
</div>