Accessing SplitDateTimeField Components Separately

To access the date and time components of a SplitDateTimeField separately in your Django template, you need to use the correct syntax to reference the subwidgets.

When using a SplitDateTimeWidget, you can access the individual date and time widgets using the following approach:

HTMLCopied
<div class="form-group">
    <label for="start_hosting_date_and_time"><i class="fas fa-calendar-alt"></i> Event dato</label>
    {% if form.start_hosting_date_and_time.errors %}
    <div class="error">
        {% for error in form.start_hosting_date_and_time.errors %}
            {{ error }}
        {% endfor %}
    </div>
    {% endif %}
    
    <!-- Date part -->
    <div class="date-part">
        {{ form.start_hosting_date_and_time.0 }}
    </div>
    
    <!-- Time part -->
    <div class="time-part">
        {{ form.start_hosting_date_and_time.1 }}
    </div>
</div>

Alternatively, you can also use the widget attribute to access the subwidgets:

HTMLCopied
<div class="date-part">
    {{ form.start_hosting_date_and_time.widget.widgets.0 }}
</div>

<div class="time-part">
    {{ form.start_hosting_date_and_time.widget.widgets.1 }}
</div>

If you're still having issues, you might need to manually render the field by accessing the HTML name attributes. You can do this by:

HTMLCopied
<div class="date-part">
    <input type="text" name="{{ form.start_hosting_date_and_time.html_name }}_0" 
           id="{{ form.start_hosting_date_and_time.auto_id }}_0"
           placeholder="dd-mm-yyyy" {% if form.is_bound %}value="{{ form.start_hosting_date_and_time.value.0 }}"{% endif %}>
</div>

<div class="time-part">
    <input type="text" name="{{ form.start_hosting_date_and_time.html_name }}_1" 
           id="{{ form.start_hosting_date_and_time.auto_id }}_1"
           placeholder="TT:MM" {% if form.is_bound %}value="{{ form.start_hosting_date_and_time.value.1 }}"{% endif %}>
</div>

Make sure to maintain the correct name attributes with the _0 and _1 suffixes so that Django can properly process the form submission.