如何将日期转换为日期下拉菜单,下拉菜单可能是单独的日,月,年

时间:2019-05-27 13:17:02

标签: javascript jquery html css django

i need this type of dropdown[![][2]] 2

<p>
  <label for="id_date_of_birth">Date of birth:</label>
  <input type="date" name="date_of_birth" value="2019-06-14" id="id_date_of_birth">
</p>

  

我正在使用django从数据库中获取数据,我试图显示下拉日期,但是我正在获取日期表

3 个答案:

答案 0 :(得分:0)

您可以将字段分为3个部分(您需要以django格式获取日/月/年部分),分为3个选择字段,如下所示:

<p>
  <label>Day:
    <select name="day">
      <option>1</option>
      <option>2</option>
      ...
      <option>31</option>
    </select>
  </label>
  <label>Month:
    <select name="month">
      <option>1</option>
      <option>2</option>
      ...
      <option>12</option>
    </select>
  </label>
  <label>Year:
    <select name="year">
      <option>1900</option>
      <option>1901</option>
      ...
      <option>3000</option>
    </select>
  </label>

但是,我会推荐这个。这使得输入日期更加困难(多次单击和滚动),用户无法复制/粘贴日期,也无法从可视日历中选择日期。您还需要添加自己的客户端逻辑,以确保用户不会选择2月31日这样的日期。

答案 1 :(得分:0)

您是否正在寻找类似的东西?

如果你不是一个好主意<3

<select name='day'>
  <option value='1'>1</option>
  <option value='2'>2</option>
  <option value='3'>3</option>
  <option value='4'>4</option>
  <option value='5'>5</option>
  <option value='6'>6</option>
  <option value='7'>7</option>
  <option value='8'>8</option>
  <option value='9'>9</option>
  <option value='10'>10</option>
  <option value='11'>11</option>
  <option value='12'>12</option>
  <option value='13'>13</option>
  <option value='14'>14</option>
  <option value='15'>15</option>
  <option value='16'>16</option>
  <option value='17'>17</option>
  <option value='18'>18</option>
  <option value='19'>19</option>
  <option value='20'>20</option>
  <option value='21'>21</option>
  <option value='22'>22</option>
  <option value='23'>23</option>
  <option value='24'>24</option>
  <option value='25'>25</option>
  <option value='26'>26</option>
  <option value='27'>27</option>
  <option value='28'>28</option>
  <option value='29'>29</option>
  <option value='30'>30</option>
  <option value='31'>31</option>
</select>

<select name='month'>
  <option value='1'>1</option>
  <option value='2'>2</option>
  <option value='3'>3</option>
  <option value='4'>4</option>
  <option value='5'>5</option>
  <option value='6'>6</option>
  <option value='7'>7</option>
  <option value='8'>8</option>
  <option value='9'>9</option>
  <option value='10'>10</option>
  <option value='11'>11</option>
  <option value='12'>12</option>
</select>

<select name='day'>
  <option value='2019'>2019</option>
  <option value='2018'>2018</option>
  <option value='2017'>2017</option>
  <option value='2016'>2016</option>
  <option value='2015'>2015</option>
  <option value='2014'>2014</option>
  <option value='2013'>2013</option>
  <option value='2012'>2012</option>
  <option value='2011'>2011</option>
  <option value='2010'>2010</option>
  <option value='2009'>2009</option>
  <option value='2008'>2008</option>
  <option value='2007'>2007</option>
  <option value='2006'>2006</option>
  <option value='2005'>2005</option>
  <option value='2004'>2004</option>
  <option value='2003'>2003</option>
  <option value='2002'>2002</option>
  <option value='2001'>2001</option>
  <option value='2000'>2000</option>
  <option value='1999'>1999</option>
  <option value='1998'>1998</option>
  <option value='1997'>1997</option>
  <option value='1996'>1996</option>
  <option value='1995'>1995</option>
  <option value='1994'>1994</option>
  <option value='1993'>1993</option>
  <option value='1992'>1992</option>
  <option value='1991'>1991</option>
  <option value='1990'>1990</option>
</select>

答案 2 :(得分:0)

在Django表单中,将DateField的小部件设置为SelectDateWidget(从django.forms.widgets导入)。然后,您只需要在模板中执行{{ form.date_of_birth }}

class ProfileUpdateView(UpdateView):
    form_class = MyProfileForm

class MyProfileForm(forms.ModelForm):
    class Meta:
        model = Profile
        widgets = {'date_of_birth': SelectDateWidget()}