Question

我尝试关注这些links和this，但是没有用。窗口小部件未加载到表单中，并且可通过链接访问js文件，从而在控制台中显示404错误。我使用香脆的表单来呈现表单。

forms.py

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

    # patient Form
    class PatientForm(ModelForm):

        birth_date = forms.DateField(label='Birth Date',widget=DateInput())
        class Meta:
            model = Patient
            exclude = ['user',]

模板

           <h2>Add Patient</h2>
            <form method="POST" action="{% url 'patients:patient_create' %}">

                {% csrf_token %}
                 {{ form|crispy }}
                <button type="submit" class="btn btn-primary" >Add Patients</button>
                <p></p>
            </form>
</div>
    {% endblock %}

    <script>
    $(document).ready(function() {
        $('.datepicker').datepicker();
    });
    </script>

js文件和CSS的链接

<script src=”https://code.jquery.com/jquery-1.12.4.js”></script>
<script src=”https://code.jquery.com/ui/1.12.1/jquery-ui.js”></script>
<link rel=”stylesheet” href=”//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css”>

控制台中的错误

Not Found: /patients/”https://code.jquery.com/jquery-1.12.4.js”
Not Found: /patients/”https://code.jquery.com/ui/1.12.1/jquery-ui.js”
[18/Jul/2019 15:29:09] "GET /patients/%E2%80%9Dhttps://code.jquery.com/jquery-1.12.4.js%E2%80%9D HTTP/1.1" 404 6742
[18/Jul/2019 15:29:09] "GET /patients/%E2%80%9Dhttps://code.jquery.com/ui/1.12.1/jquery-ui.js%E2%80%9D HTTP/1.1" 404 6760
Not Found: /patients/”https://code.jquery.com/jquery-1.12.4.js”
[18/Jul/2019 15:29:10] "GET /patients/%E2%80%9Dhttps://code.jquery.com/jquery-1.12.4.js%E2%80%9D HTTP/1.1" 404 6742
Not Found: /patients/”https://code.jquery.com/ui/1.12.1/jquery-ui.js”
[18/Jul/2019 15:29:10] "GET /patients/%E2%80%9Dhttps://code.jquery.com/ui/1.12.1/jquery-ui.js%E2%80%9D HTTP/1.1" 404 6760
Not Found: /favicon.ico

在我的代码中，我有很多jquery版本都可能导致问题。我想要一个比jquery ui更用户友好的小部件，所以我可以使用其他任何方法来以与jquery ui相同的方式添加小部件吗？

Answer 1

在您的forms.py中：

class DateInput(forms.DateInput):
     input_type = 'date'

class PatientForm(ModelForm):


        class Meta:
            model = Patient
            exclude = ['user',]
            widgets = {
                'birth_date':DateInput,
               }

尝试

Answer 2

问题在于，现代浏览器在不将type设置为date的情况下不会显示选择日期

这是为我解决的问题

DateInput = partial(forms.DateInput, {'class': 'datepicker','type': 'date'})
# patient Form
class PatientForm(ModelForm):

    birth_date = forms.DateField(label='Birth Date',widget=DateInput())
    class Meta:
        model = Patient
        exclude = ['user',]

如何在Django表单中添加日期/日历小部件？

2 个答案: