Problem/Motivation
Can not use datetime type field in AJAX AppendCommand, because the renderer service render empty div container.
Steps to reproduce
If you use this code:
$form['datetime_test'] = [
'#type' => 'datetime',
'#title' => t('Datetime test grisko'),
'#date_date_element' => 'date',
'#date_time_element' => 'time'
];
$form['datetime_test2'] = $form['datetime_test'];
$form['datetime_test2']['#title'] = t('Datetime test grisko2');
$form['datetime_test_rendered_grisko'] = [
'#markup' => '<div class="grisko hablaty">' . \Drupal::service('renderer')->render($form['datetime_test2']) . '</div>'
];
You will get this result:
<div id="edit-datetime-test" data-drupal-field-elements="date-time" class="container-inline">
<div class="js-form-item form-item js-form-type-date form-type-date js-form-item-datetime-test-date form-item-datetime-test-date form-no-label">
<label for="edit-datetime-test-date" class="visually-hidden">Datum</label>
<input data-drupal-selector="edit-datetime-test-date" title="Datum (z. B. 2023-04-19)" type="date" data-drupal-date-format="Y-m-d" placeholder="YYYY-MM-DD" data-help="Enter the date using the format YYYY-MM-DD (e.g., 2023-04-19)." id="edit-datetime-test-date" name="datetime_test[date]" value="" size="12" class="form-date">
</div>
<div class="js-form-item form-item js-form-type-date form-type-date js-form-item-datetime-test-time form-item-datetime-test-time form-no-label">
<label for="edit-datetime-test-time" class="visually-hidden">Zeit</label>
<input data-drupal-selector="edit-datetime-test-time" title="Enter a valid time - e.g. 05:01" type="time" step="60" placeholder="hh:mm:ss" data-help="Enter the time using the format hh:mm:ss (e.g., 05:01:37)." id="edit-datetime-test-time" name="datetime_test[time]" value="" size="12" class="form-time">
</div>
</div>
<div class="grisko hablaty"> <h4 class="label">Datetime test grisko2</h4>
<div data-drupal-field-elements="date-time" class="container-inline">
</div>
</div>
Proposed resolution
Render the datetime element correctly.
Remaining tasks
User interface changes
API changes
Data model changes
Release notes snippet
Comments
Comment #3
juan.vallejos commentedHi, Were you able to solve this problem?
Comment #4
dwwThis issue came up as a random triage target via the #bugsmash initiative. I haven't directly tried to reproduce, but from the description, it sounds potentially valid. Reminds me of other issues where these elements are not rendered properly. Adding #3078334: Datetime and Datelist elements should render as fieldsets as related. I wonder if fixing that issue would solve this one "for free"...
That said, the specific "steps to reproduce" in the summary are somewhat bogus. When creating a form, you don't need/want to individually try to render parts of the form like that. If this is specifically about using AJAX, it'd be great to see valid steps to reproduce involving the use of AJAX. As it is, this mostly looks like user error.
Comment #5
smustgrave commented@riskogab able ot cleanup the steps some? Else think we can close this.
Comment #7
smustgrave commentedSince there's been no follow up going to close out. If still an issue in D11+ please re-open
Thanks.