Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ignoreReadonly not working properly #362

Open
samozeleznik opened this issue Dec 4, 2020 · 1 comment
Open

ignoreReadonly not working properly #362

samozeleznik opened this issue Dec 4, 2020 · 1 comment

Comments

@samozeleznik
Copy link

samozeleznik commented Dec 4, 2020

I want to disable keyboard popping up on mobile when opening the datetimepicker.

The first issue is that initializing the datepicker overrides the readonly attribute of the input field. That means you have to set it after initializing datetimepicker (example of the issue: https://jsfiddle.net/q85tcf60/3/)

I was able to get around this with the following code:

    $('#datetimepicker1').datetimepicker({
      ignoreReadonly: true
    });
    $('#datetimepicker-input-1').attr("readonly", "readonly");

HTML:

    <div class="input-group date mb-1 w-auto" id="datetimepicker1" data-target-input="nearest">
      <input type="text" id="datetimepicker-input-1" class="form-control datetimepicker-input" data-target="#datetimepicker1" data-toggle="datetimepicker" />
      <div class="input-group-append" data-target="#datetimepicker1" data-toggle="datetimepicker">
          <div class="input-group-text"><i class="fa fa-calendar"></i></div>
      </div>
    </div>

The issue is, that this way you cannot select a new value for the field. The datetimepicker opens up, but nothing is clickable and you cannot select a different time or date.

JsFiddle example:
https://jsfiddle.net/q85tcf60/2/

EDIT:
Tested this functionality with datetimepicker 4.15.35 and it seems to be working fine.

@ya2nk
Copy link

ya2nk commented May 4, 2021

just uncomment unminified js code in line 2253

if (this.input !== undefined && this.input.prop('readonly') || this._options.readonly) {
//template.addClass('bootstrap-datetimepicker-widget-readonly');
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants