Django中未出现JSignature字段

时间:2019-03-30 20:18:42

标签: python jquery django jsignature

第一次在网站上发帖,因为我是新手,所以在此道歉。

在Visual Studio中为一个类构建Django项目,并且需要签名表单才能显示在页面之一上。目前正在遵循本指南:https://pypi.org/project/django-jsignature/,但遇到障碍,因为我只能在页面上显示的是保存按钮。下面列出了我所拥有的。

forms.py

from django import forms

...

from jsignature.forms import JSignatureField

from jsignature.widgets import JSignatureWidget

...

class SignatureForm(forms.Form):

    signature = JSignatureField()

template.html

{% extends "app/layout.html" %}

{% block content %}

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta charset="utf-8" />

    <title></title>

</head>

<body>

    {{form.media }}

    <form action="." method="POST">

        {% for field in form %}

            {{ field.label_tag }}

            {{ field }}

        {% endfor %}

        <input type="submit" value="Save"/>

        {% csrf_token %}

    </form>

</body>

{% endblock %}

views.py

from jsignature.utils import draw_signature

from app.forms import SignatureForm

...

def signature(request):

    assert isinstance(request, HttpRequest)

    return render(

        request,

        'app/template.html',

        {

            'title':'About',

            'message':'Your application description page.',

            'year':datetime.now().year,

        }

    )

def my_view(request):

    form = SignatureForm(request.POST or None)

    if form.is_valid():

        signature = form.cleaned_data.get('signature')

        if signature:

            #as an image

            signature_picture = draw_signature(signature)

            #or as a file

            signature_file_path = draw_signature(signature, as_file=True)

同样,当进入我的模板页面时,所有填充的是一个单独的保存按钮。我已将其包含在布局html页面的正文中,因为我已经阅读过,这可能是在页面上运行脚本的问题,但还是没有运气。

<script src="ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

有人能指出我正确的方向吗?希望我提供了足够的信息。

3 个答案:

答案 0 :(得分:0)

我知道这很旧,但是我刚刚安装了django-jsignature并遇到了同样的问题。我是Django的新手,并希望与那些对Django还是新手并希望在其项目中使用django-jsignature的人共享解决方案。

您需要检查一些事情。

  1. 首先,使用Chrome,然后转到开发人员工具。检查您的控制台,看看是否有Javascript错误。如果这样做,则必须修改2个文件。

您需要修改的2个文件位于https://github.com/fle/django-jsignature/pull/11/commits

重新加载模板页面,然后查看页面上是否仍然存在JavaScript错误。 我正在使用jQuery Core 3.4.1。这对我很有效,没有错误。我已经将jQuery脚本链接放在html页面的头部。

删除所有其他javascript依赖项以确保它们没有冲突。

现在,如果您不再遇到JavaScript错误并且仍然没有签名板,请转到步骤2。

  1. 在Chrome和“查看页面源代码”中加载html模板。在应该具有签名部分的位置,您应该在表格中看到一个“隐藏” div。这表示表单已正确载入html,但您的CSS可能会导致此部分无法正确显示。

如果是这种情况,请尝试创建一个新模板,并在其中包含jsignature模板代码,而无需测试任何CSS。

  1. 如果在单击“查看页面源”时在签名模板html上看不到“隐藏”的div,则表明您的页面无法正确呈现。

    a。确保在您的views.py中,在上下文中添加{'form': form }。该说明未包含在自述文件中。 示例:return render(request, 'your_signature_template.html', {'form': form }

    b。确保在您的signature_template html文件中,表单上方有{{ form.media }}

答案 1 :(得分:0)

严格按照pypi网站上django jsignature教程中的内容进行操作,只需确保模板的head标签中具有最新版本的jquery。而且也不要忘记将签名表单的空实例传递给您的render方法并传递给模板

我做了一个演示。结帐https://djsign.herokuapp.com 您可以在https://github.com/mnnlthmpsn/djsignature.git

中找到代码

答案 2 :(得分:0)

我有同样的问题。我通过更改放置{{ form.media }}的位置来修复它。 文档说,要把它放在表格上方,我将它插入所有其他JS导入下面。

base.html

.
.
.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.bundle.min.js"</script>
{% block extra_javascript %}{% endblock %}

form-template.html

{% extends "base.html" %}
{% crispy form main_helper%}
{% block extra_javascript %}
   {{form.media}}
{% endblock %}