【问题标题】:Display flags in Django form & templates with Django-countries使用 Django 国家/地区在 Django 表单和模板中显示标志
【发布时间】:2018-02-26 20:02:33
【问题描述】:

我正在使用Django-countries,但我无法在我的 Django 表单或任何模板中的每个国家/地区旁边显示国家/地区标志。

我很好地显示了国家列表,我在我的静态文件夹中正确设置了 flags 文件夹。但无法显示标志。

在我的模型中,我有:

PaysNaissance = CountryField(blank_label='Sélectionner un pays', verbose_name='Pays de naissance')

然后,我的表单会显示这样的国家/地区:

如您所见,我的列表中没有任何标志。你对这个问题有什么想法吗?

设置配置良好,在我的模板中:

<table style="width:100%">
            <tbody>
                <p></p>
            <tr>
                <th> Informations sur l'individu </th>
                <th> Données renseignées </th>
            </tr>
            <tr>
                <td>Pays de Naissance</td>
                <td>{{personne.PaysNaissance}}</td>
            </tr>
            </tbody>
 </table>

它显示:FR 但是如果我想显示标志,我设置{{personne.PaysNaissance.flag}},我有/static/flags/fr.gif

所以为了显示标志我必须写: &lt;td&gt;&lt;img src='{{personne.PaysNaissance.flag.url}}'/&gt;&lt;/td&gt;

但它似乎不起作用。

在我的表单部分:

<form class = "form" method='POST' action='' enctype="multipart/form-data"> {% csrf_token %} <br></br>

        {{ form.as_p }} 
        {{birthday|date:"%d/%m/%Y" }} 
        <input type="submit" onclick="return confirm('Valider le formulaire ?')" /> 
    </form>

【问题讨论】:

  • 你能显示模板的确切 HTML 代码吗?问题出在
  • 我在我的问题中添加了一些信息;)

标签: django django-countries


【解决方案1】:

你需要写:

<td><img src='{{personne.PaysNaissance.flag}}'/></td>

因为 {{ personne.PaysNaissance.flag }} 本身包含标志 url。不需要额外写flag.url。

还有一件事可以做:

使用:

<link rel="stylesheet" href="{% static 'flags/sprite.css' %}">


<td><i class="{{ personne.PaysNaissance.flag_css }}"></i></td>

这会起作用。

【讨论】:

  • 第一步效果很好!只有一个问题:如果我想在我的 django 列表表单中显示标志,我该怎么做?
  • @Deadpool 你能告诉我 HTML 表单的渲染输出吗?形式也应该以同样的方式发生。
  • 是的,你有一个关于我的渲染输出 HTML 表单的问题的例子。我不知道我是否必须添加这样的内容:{{ form.PaysNaissance.flag}}
  • @Deadpool {{ form.as_p }} 是模型表单对吗?为此,您还需要使用 ints 标志扩展国家/地区名称。在 forms.py 文件中。
  • 你是对的 ;) 好的,我会在 forms.py 文件中尝试一些东西!谢谢
猜你喜欢
  • 2014-12-19
  • 2015-11-27
  • 1970-01-01
  • 1970-01-01
  • 2021-07-25
  • 2021-04-04
  • 1970-01-01
  • 2017-10-01
  • 1970-01-01
相关资源
最近更新 更多