date picker

sum abiut

unread,

Jan 17, 2016, 8:03:48 PM1/17/16

to django...@googlegroups.com

Hi,

i am having some trouble with my date picker. I probably missing someting, the form fields are displaying fine, but some how the datepicker is no displaying. probably something to do with my jquery. Please help

models.py
class foreginexchange(models.Model):
    Sold_deal_number=models.CharField(max_length=45)
    Value_date=models.DateField()
    Vatu_equivalent=models.CharField(max_length=45)
    Instructions=models.TextField()
    Done_Date=models.DateField()
    Booked=(
            ('Tonny Garae','Tonny Garae'),
            ('Fredric Jacob','Fredric Jacob'),
)
Worked_By=models.CharField(max_length=45,choices=Worked)

def __unicode__(self):
        return self.Sold_deal_number

form.py

from django import forms

from foregin_exchange.models import foreginexchange

class foregin_exchange_form(forms.ModelForm):
    class Meta:
        model =foreginexchange
        widgets = {'Value_date': forms.DateInput(attrs={'class':'datepicker'}),}
        widgets={'Done_Date':forms.DateInput(attrs={'class':'datepicker'}),}

template.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">


    
   <meta charset="utf-8">
<title>jQuery UI Datepicker - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
$(function() {
    $( "#datepicker" ).datepicker();
});
</script>



</head>

<body>

{%extends "loginpage.html"%}

         {%block content%}
          <h3 class="sub-header">Add New Foregin Exchange Data</h3>

          <div class="table-responsive">
            <div id="main">
                    <form action ="{% url 'test'%}" method="post">{%csrf_token%}
                    <table>
                    {{form.as_table}}
                    </table>
                    <br>
                    <input type="submit" name="submit" value="Save Data" >
                    </form>

                    </div>
          </div>

          {%endblock%}


</body>
</html>

Michal Petrucha

unread,

Jan 18, 2016, 3:30:37 AM1/18/16

to django...@googlegroups.com

On Mon, Jan 18, 2016 at 12:03:00PM +1100, sum abiut wrote:
> Hi,
> i am having some trouble with my date picker. I probably missing someting,
> the form fields are displaying fine, but some how the datepicker is no
> displaying. probably something to do with my jquery. Please help

Could you perhaps go more into detail? Do you want to have a date
picker widget on both DateFields, or only one of them? Does the date
picker appear on one of them, but not the other, or does it appear on
neither? What does the final rendered HTML look like? (Just the
relevant parts.)

> models.py
> class foreginexchange(models.Model):
> Sold_deal_number=models.CharField(max_length=45)
> Value_date=models.DateField()
> Vatu_equivalent=models.CharField(max_length=45)
> Instructions=models.TextField()
> Done_Date=models.DateField()
> Booked=(
> ('Tonny Garae','Tonny Garae'),
> ('Fredric Jacob','Fredric Jacob'),
> )
> Worked_By=models.CharField(max_length=45,choices=Worked)
>
> def __unicode__(self):
> return self.Sold_deal_number
>
>
> form.py
>
> from django import forms
>
> from foregin_exchange.models import foreginexchange
>
> class foregin_exchange_form(forms.ModelForm):
> class Meta:
> model =foreginexchange
> widgets = {'Value_date':
> forms.DateInput(attrs={'class':'datepicker'}),}
> widgets={'Done_Date':forms.DateInput(attrs={'class':'datepicker'}),}

This here looks wrong. The first assignment to “widgets” would set the
class for “Value_date”, and the following assignment throws the
previous setting away and replaces it with a setting for “Done_Date”.

If the problem is that the date picker works for “Done_Date”, but not
“Value_date”, then this is the problem.

You're probably looking for something like::

widgets = {
'Value_date': forms.DateInput(attrs={'class': 'datepicker'}),

'Done_Date': forms.DateInput(attrs={'class':' datepicker'}),
}

Regards,

Michal

signature.asc

Tom Evans

unread,

Jan 18, 2016, 9:47:26 AM1/18/16

to django...@googlegroups.com

On Mon, Jan 18, 2016 at 1:03 AM, sum abiut <sua...@gmail.com> wrote:
> Hi,
> i am having some trouble with my date picker. I probably missing someting,
> the form fields are displaying fine, but some how the datepicker is no
> displaying. probably something to do with my jquery. Please help

> [ ... ]

> class foregin_exchange_form(forms.ModelForm):
> class Meta:
> model =foreginexchange
> widgets = {'Value_date':
> forms.DateInput(attrs={'class':'datepicker'}),}
> widgets={'Done_Date':forms.DateInput(attrs={'class':'datepicker'}),}

This sets the *class* of the element to "datepicker".

> [ ... ]

> <script>
> $(function() {
> $( "#datepicker" ).datepicker();
> });
> </script>

This turns an element with the *id* "datepicker" in to a date picker.

Cheers

Tom

sum abiut

unread,

Jan 18, 2016, 4:29:16 PM1/18/16

to django...@googlegroups.com

Yes i want to have the date picker widget on both DateFields. The date picker does not appear on both datefields. i have made changes, but still date picker is not showing

widgets = {
'Value_date': forms.DateInput(attrs={'class': 'datepicker'}),

'Done_Date': forms.DateInput(attrs={'class':' datepicker'}),
}

Cheers,

--
You received this message because you are subscribed to the Google Groups "Django users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to django-users...@googlegroups.com.
To post to this group, send email to django...@googlegroups.com.
Visit this group at https://groups.google.com/group/django-users.
To view this discussion on the web visit https://groups.google.com/d/msgid/django-users/CAFHbX1LP8XWTOcwgp3ZMdGOz7XP%2B9srKFEoJ_bWRS9YFbU5Tiw%40mail.gmail.com.

For more options, visit https://groups.google.com/d/optout.

-

Michal Petrucha

unread,

Jan 18, 2016, 4:39:13 PM1/18/16

to django...@googlegroups.com

On Tue, Jan 19, 2016 at 08:28:00AM +1100, sum abiut wrote:
> Yes i want to have the date picker widget on both DateFields. The date
> picker does not appear on both datefields. i have made changes, but still
> date picker is not showing
> widgets = {
> 'Value_date': forms.DateInput(attrs={'class': 'datepicker'}),
> 'Done_Date': forms.DateInput(attrs={'class':' datepicker'}),
> }

Great, another thing you need to do is to follow Tom's advice:

> On Tue, Jan 19, 2016 at 1:46 AM, 'Tom Evans' via Django users <
> django...@googlegroups.com> wrote:
> > widgets={'Done_Date':forms.DateInput(attrs={'class':'datepicker'}),}
> >
> > This sets the *class* of the element to "datepicker".
> >
> > > [ ... ]
> > > <script>
> > > $(function() {
> > > $( "#datepicker" ).datepicker();
> > > });
> > > </script>
> >
> > This turns an element with the *id* "datepicker" in to a date picker.

Trips me every time (maybe when I'm old and wrinkled I'll be able to
remember off the top of my head that # is for the id and . is for the
class).

So yeah, use ``$(".datepicker").datepicker();`` here.

Good luck,

Michal

signature.asc

sum abiut

unread,

Jan 18, 2016, 4:58:29 PM1/18/16

to django...@googlegroups.com

Thank heaps for your help. I have made the changes, still datepicker is not showing on the datefields.

Cheers

--
You received this message because you are subscribed to the Google Groups "Django users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to django-users...@googlegroups.com.
To post to this group, send email to django...@googlegroups.com.
Visit this group at https://groups.google.com/group/django-users.

To view this discussion on the web visit https://groups.google.com/d/msgid/django-users/20160118213756.GB20308%40koniiiik.org.

For more options, visit https://groups.google.com/d/optout.

-

Michal Petrucha

unread,

Jan 18, 2016, 5:21:18 PM1/18/16

to django...@googlegroups.com

On Tue, Jan 19, 2016 at 08:57:38AM +1100, sum abiut wrote:
> Thank heaps for your help. I have made the changes, still datepicker is not
> showing on the datefields.
>
> Cheers

That's unfortunate – could you perhaps post the HTML output? Does it
contain the required JavaScript?

That template you posted in your original post, was that copy-pasted
from the actual template that is used?

Michal

signature.asc

sum abiut

unread,

Jan 18, 2016, 5:57:27 PM1/18/16

to django...@googlegroups.com

Hi Michal,

here is my template.html, i believe it has all the required java script, Yes the origin template was copy past from this template.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">

$(".datepicker").datepicker();

});
</script>




</head>

<body>

{%extends "loginpage.html"%}

         {%block content%}
          <h3 class="sub-header">Add New Foregin Exchange Data</h3>

          <div class="table-responsive">
            <div id="main">
                    <form action ="{% url 'test'%}" method="post">{%csrf_token%}
                    <table>

                    {{form.as_table}}
                    </table>
                    <br>
                    <input type="submit" name="submit" value="Save Data" >
                    </form>

                    </div>
          </div>

          {%endblock%}

</div>
      </div>
    </div>

    
    
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src="../../assets/js/vendor/jquery.min.js"><\/script>')</script>
    <script src="../../dist/js/bootstrap.min.js"></script>
    
    <script src="../../assets/js/vendor/holder.min.js"></script>
    
    <script src="../../assets/js/ie10-viewport-bug-workaround.js"></script>
</body>
</html>

Thanks,

Sum

Michal

--
You received this message because you are subscribed to the Google Groups "Django users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to django-users...@googlegroups.com.
To post to this group, send email to django...@googlegroups.com.
Visit this group at https://groups.google.com/group/django-users.

To view this discussion on the web visit https://groups.google.com/d/msgid/django-users/20160118222011.GC20308%40koniiiik.org.

Michal Petrucha

unread,

Jan 18, 2016, 6:29:00 PM1/18/16

to django...@googlegroups.com

On Tue, Jan 19, 2016 at 09:56:49AM +1100, sum abiut wrote:
> Hi Michal,
>
>
> here is my template.html, i believe it has all the required java script,
> Yes the origin template was copy past from this template.

Hi Sum,

I asked for the rendered output HTML, not the original template. But
mostly I'm just interested in whether the rendered output contains all
the stuff that appears before the following line::

{%extends "loginpage.html"%}

I've never seen this kind of usage of template inheritance, and I'd
suspect that it is wrong. When template a.html extends base.html, then
a.html will contain everything from base.html, except for the blocks
it overrides. In this case, you only override the block named
“content”, so that should be the only difference compared to
“loginpage.html”. Everything that appears outside {% block content %}
is probably ignored. (I'd expect the template parser to raise an
error in this case, but I may be wrong.)

The idiomatic way of using template inheritance is to create a common
base.html, which will contain the general structure of your HTML
output, and a bunch of empty block definitions to be filled by its
descendants, such as “content”, “extra_head”, etc. Then, in
loginpage.html you override “content”, and in form.html you override
both “extra_head” (with the datepicker javascript), and “content”.

Good luck,

Michal

signature.asc

Reply all

Reply to author

Forward