Topic: datepicker confirmDateOnSelect
                  
                  KelsoField
                  priority
                  asked 1 year ago
                
Expected behavior adding confirmDateOnSelect to the input container maked the datepicker cloise on select Actual behavior no errors, but I cannot make it work. Again, i feel the documatation is too fragmented, wheras one method may cancel another and it is difficult to determine the best method. I am using UMD with all the options set via data attributes. I want the picker to close when the user selects a date.
I have added confirmDateOnSelect to the datepicker container as .confirmDateOnSelect, data-mdb-confirmDateOnSelect, data-mdb-confirmDateOnSelect="true" I have also tried to apply it on the input itself, same variations. none seem to trigger the behaviour. but all other data- options work.
any ideas?
Resources (screenshots, code snippets etc.) Picker container:
<div class="col-md-4">
            <label class="form-label" for="insdate">Examination Date</label>
            <div id="insCont" class="input-group datepicker" data-mdb-datepicker-init data-date-type="disableFuture" data-mdb-toggle-button="false" data-mdb-input-init
                 data-mdb-format="dd-mm-yyyy">
                <input class="form-control" data-mdb-toggle="datepicker" type="text" name="insdate" id="insdate" value="<?= date('d-m-Y') ?>" placeholder="DD-MM-YYYY"
                       style="width: auto;" />
                <button class="btn btn-md btn-info m-0 px-3" type="button" onclick="triggerCal('insdate')">
                    <i class="fad fa-calendar-alt"></i></button>
            </div>
        </div>
PIcker event:
const insDatePicker = document.querySelector('#insCont')
insDatePicker.addEventListener('valueChanged.mdb.datepicker', (e) => {
    console.log('Datepicker value changed event:', e);
    const newDateValue = document.querySelector('#insdate').value
    console.log('New date value:', newDateValue);
    changeFreq(newDateValue)
})
                
                  
                      
                      KelsoField
                      priority
                        answered 1 year ago
                    
Thank you, that sorted it. Good to know the tip for converting options to data attributes.
I appreciate the assist.
                      
                      Grzegorz Bujański
                      free
                        answered 1 year ago
                    
Try data-mdb-confirm-date-on-select="true". 
Always, if you have an option that consists of many words, to make it a data attribute, put a - before the capital letter and change the capital letter to a lowercase letter. So, for example, for the removeOkBtn option it will be data-mdb-remove-ok-btn="true"
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Priority
 - Premium support: Yes
 - Technology: MDB Standard
 - MDB Version: MDB5 7.3.2
 - Device: *all
 - Browser: *all
 - OS: *all
 - Provided sample code: No
 - Provided link: No