date picker functionality

[Kateattardo]

Describe the bug A clear and concise description of what the bug is. The Materialize date picker functionality isn't working.

What is the problem you are trying to solve? The Materialize date picker functionality isn't working.

Expected behavior A clear and concise description of what you expected to happen. I expect the date picker functionality to work when selecting the due date for a project

What is the actual behavior? A clear and concise description of what actually happened. No errors generated but the date picker does not pop up

Post any code you think might be relevant (one fenced block per file)

```  document.addEventListener('DOMContentLoaded' , function() {
    var elms = document.querySelectorAll('.datepicker');
    var instances = M.Datepicker.init(elems, {
      format: 'yyyy-mm-dd',
      defaultDate: newDate(),
      setDefaultDate: true,
      autoClose:true
    });

from django import forms
from django.forms.widgets import DateTimeInput
from django import ModelForm
from main_app.models import, Project, Task, 

class ProjectForm(forms.ModelForm):
  due_date = forms.DateTimeField(widget=CustomDateTimeInput())

  class Meta:
    model = Project
    fields = [...]

class TaskForm(forms.ModelForm):
  due_date = forms.DateTimeField(widget=CustomDateTimeInput())

  class Meta:
    model = Task
    fields = [...]

What is your best guess as to the source of the problem? Somthing I'm missing in the forms

What things have you already tried to solve the problem?

  // const dateEl = document.getElementById('task_due_date');
  // // M is Materialize's global variable
  // M.Datepicker.init(dateEl, {
  //     format: 'yyyy-mm-dd',
  //     defaultDate: new Date(),
  //     setDefaultDate: true,
  //     autoClose: true
  // });

  // const selectEl = document.getElementById('project_due_date');
  // M.FormSelect.init(selectEl)

I've tried task_due_date, project_due_date, id_date

**Additional context**
Add any other context about the problem here.

**Paste a link to your repository here**

[asands94]

Did you add the javascript cdn link to the base.html?

[asands94]

<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>

[Kateattardo]

Yes I did

On Sep 19, 2023, at 10:14 AM, Ashley Sands @.***> wrote:

Did you add the javascript cdn link to the base.html?

— Reply to this email directly, view it on GitHub https://github.com/sei-ec-remote/team-project-issues/issues/161#issuecomment-1725691462, or unsubscribe https://github.com/notifications/unsubscribe-auth/BA3RBG6EHVDQ5I6XYYJXD33X3GSDDANCNFSM6AAAAAA46KY7O4. You are receiving this because you authored the thread.

[asands94]

You maye need to try something like this based on the name of your model fields

 <script>
        const dateEl = document.getElementById('id_due_date');
        // M is Materialize's global variable
        M.Datepicker.init(dateEl, {
            format: 'yyyy-mm-dd',
            defaultDate: new Date(),
            setDefaultDate: true,
            autoClose: true
        });
    </script>

[asands94]

You can also use your dev tools to tell you what the ID is by hovering over that field.

[Kateattardo]

Still nothing I’ve tried A LOT of (‘…_date’)

On Sep 19, 2023, at 10:23 AM, Ashley Sands @.***> wrote:

You maye need to try something like this based on the name of your model fields

— Reply to this email directly, view it on GitHub https://github.com/sei-ec-remote/team-project-issues/issues/161#issuecomment-1725709696, or unsubscribe https://github.com/notifications/unsubscribe-auth/BA3RBG6BG77G32EQSVVTKCTX3GTFHANCNFSM6AAAAAA46KY7O4. You are receiving this because you authored the thread.