This is a migrated thread and some comments may be shown as answers.

DatePicker in Bootstrap form-group

3 Answers 199 Views
DatePicker
This is a migrated thread and some comments may be shown as answers.
Tom
Top achievements
Rank 1
Tom asked on 05 Sep 2019, 12:08 PM

I'm trying to get a DatePicker to display correctly in a page that's using Bootstrap `form-group` and `form-control` tags, but I'm not having much success. 

The TelerikDateInput component exposes the Class property, but I don't think the DatePicker (or at least it doesn't seem to from my experimentation and from the documentation?

I've tried various ways of doing this, e.g. 

<div class="form-group">
  <label for="dueDate" class="control-label  col-md-4">Expected Arrival Date: </label>
  <div class="col-md-8">
      <TelerikDatePicker Class="form-control" Format="dd/MM/yyyy" @bind-Value="@State.BillOfLadingVM.DueDate" />
  </div>           
  <ValidationMessage For="@(() => State.BillOfLadingVM.DueDate)" />
</div>

 

But I always get something along the lines of the attached image.

Is there any way to get this to work?

3 Answers, 1 is accepted

Sort by
0
Marin Bratanov
Telerik team
answered on 05 Sep 2019, 01:02 PM

Hi Tom,

Are you using the Bootstrap theme we provide?

On the Class property - there is one, it is listed in the API reference.

The thing is that you don't need the "form-control" class, as it adds padding and borders, and we already have a layout on our components, it needs to be present only for simple elements. We do have some overrides to take care of those issues, but that may still be a work in progress in certain places.

That said, I am attaching here a few files from the default project that show how this works for me with the Bootstrap theme we provide, so you can compare against it and see what's the difference.

 

Regards,
Marin Bratanov
Progress Telerik

 UI for Blazor
0
Tom
Top achievements
Rank 1
answered on 05 Sep 2019, 04:44 PM

Hi Marin

Thanks for the example, I'll have a look at that.  Which version of Bootstrap is the Telerik theme targeting, is it 4.x?

Cheers,

Tom

0
Marin Bratanov
Telerik team
answered on 06 Sep 2019, 07:51 AM

Hi Tom,

I think 4.something was the last one tested, with the SASS themes we have. If more concrete numbers are required, I could check with our front end architect to see if this information is available.

 

Regards,
Marin Bratanov
Progress Telerik

 UI for Blazor
Tags
DatePicker
Asked by
Tom
Top achievements
Rank 1
Answers by
Marin Bratanov
Telerik team
Tom
Top achievements
Rank 1
Share this question
or