search

asaglimbeni / django-datetime-widget

Bootstrap django-datetime-widget is a simple and clean widget for DateField, Timefiled and DateTimeField in Django framework. It is based on Bootstrap datetime picker, supports both Bootstrap 3 and Bootstrap 2
Other
219 stars 125 forks source link

Datepicker is not showing #75

Open Hiieu opened 9 years ago

Hiieu commented 9 years ago

I have all requirements. So I think something is wrong with my model or form

#models.py
class MyModel(models.Model):
    number = models.IntegerField(max_length=20, unique=True)
    start_date = models.DateField(null=True, blank=True)
    end_date = models.DateField(null=True, blank=True)

    def __str__(self):
        return '%s' % self.first_name
#forms.py
class MyForm(forms.ModelForm):
    class Meta:
        model = MyModel
        widgets = {
            'datetime': DateTimeWidget(attrs={'id': "yourdatetimeid"})
        }
fercreek commented 9 years ago

@Hiieu Try to change "datetime" by the name of one of your models.

Hiieu commented 9 years ago

Aaah can't do that. MyModel have to have DateField()

HadrienMP commented 9 years ago

I think that what @fercreek meant was change 'datetime' to 'start_date' or 'end_date'

Hiieu commented 9 years ago

Unfortunately it is still not working

    widgets = {
        'start_date': DateWidget(attrs={'id': "yourdatetimeid"})
    }

I got bootstrap.js and bootsrap.min.css and jquery 1.8.3 and {{ form.media }}

fercreek commented 9 years ago

widgets = { 'start_date': DateWidget(attrs={'id': "start_date"}, usel10n=True, bootstrap_version=3) }

n3storm commented 9 years ago

@fercreek What is the name of the field in your model you want to use this widget with?

ollytheninja commented 9 years ago

@Hiieu does it matter that you are using a DateTimeWidget with a DateField not a DateTimeField?

I do it like so: "event_start": DateTimeWidget(bootstrap_version=3) If you aren't changing the IDs of the form fields you shouldn't have to specify them manually.

David-OConnor commented 8 years ago

Same issue. Amplifying data: I receive this message in the JS console: 'TypeError: $(...).datetimepicker is not a function'

ssokolow commented 8 years ago

@David-OConnor Check what HTML is actually getting generated by {{ form.media }} to narrow down the location of the problem.

In my case, I'd accidentally typo'd a field name, which caused Django to omit the CSS and JS associated with DateTimeWidget since no field on the page used it.

If it IS working, make sure you're NOT doing the perceptual optimization of loading your JavaScript in the page footer like the Bootstrap people tell you to do.

This widget injects inline JavaScript into the page body, which means {{ form.media }} must be in the page header... and {{ form.media }} must come after jQuery, which means you can't load that in the page footer either.

(The long-term solution is to rework the JS so configuration is done using data- attributes and no inline scripting is injected. That'd also have the benefit of allowing a Content Security Policy which prevents XSS by instructing the user's browser to ignore JavaScript within HTML files.)

David-OConnor commented 8 years ago

Thanks; will check that out when I'm back home in a month.

joej commented 6 years ago

I'm thinking ... the "$(#.......)" javascript runs BEFORE you have loaded jquery.

If you load jquery in head, then it shouldn't be a problem. If you load it in the bottom of the doc, then you might see this err.

treyd commented 6 years ago

I had this issue as well, but I was able to fix it. The things I checked (and forgot to do):

  1. Move jQuery <script> to the top of your template
  2. Make sure you are including {{ form_name.media }} in the <head> of your template
  3. Make sure you've got datetimewidget in your INSTALLED_APPS (i forgot this)