如何强制 Django 使用来自 CDN 的 select2 而不是本地管理版本?
How to force Django to use select2 from the CDN instead of the local admin version?
我正在尝试使用 Django
实现一个网站。我使用 select2
作为我的组件之一。我的问题是,在呈现模板时,Django 使用来自 admin
的 select2
,它位于此处:Click here to go to GitHub code。我想使用从 CDN 加载的 select2
,因为它较新,而且我想传递额外的参数。
这是我的代码(我删除了不必要的部分以使其更简单):
core/templates/core/base.html:
<!DOCTYPE html>
{% load static %}
<html>
<head>
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-beta.1/dist/css/select2.min.css" rel="stylesheet"/>
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-beta.1/dist/js/select2.min.js"></script>
</head>
<body>
{% block content %}
{% endblock %}
{% block scripts %}
{% endblock %}
</body>
</html>
app_name/templates/app_name/template_name.html:
{% extends 'core/base.html' %}
{% block content %}
<form method="post">
{% csrf_token %}
<div class="form-group form-group-lg">
<div class="input-group input-group-lg col-12">
<select id="id_select2" class="form-control selectpicker" name="options[]"
multiple="multiple" data-live-search="true">
<option data-tokens="123" value="456">Test</option>
</select>
</div>
</div>
</form>
{% endblock %}
{% block scripts %}
<script>
$(document).ready(function () {
$('#id_select2').select2();
});
</script>
{% endblock %}
我知道这个问题是因为有两个名称和参数完全相同的函数。
我建议您将 select2(脚本)的导入放在 html 的正文中,就在您自己的脚本标签之前
:D
我正在尝试使用 Django
实现一个网站。我使用 select2
作为我的组件之一。我的问题是,在呈现模板时,Django 使用来自 admin
的 select2
,它位于此处:Click here to go to GitHub code。我想使用从 CDN 加载的 select2
,因为它较新,而且我想传递额外的参数。
这是我的代码(我删除了不必要的部分以使其更简单):
core/templates/core/base.html:
<!DOCTYPE html>
{% load static %}
<html>
<head>
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-beta.1/dist/css/select2.min.css" rel="stylesheet"/>
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-beta.1/dist/js/select2.min.js"></script>
</head>
<body>
{% block content %}
{% endblock %}
{% block scripts %}
{% endblock %}
</body>
</html>
app_name/templates/app_name/template_name.html:
{% extends 'core/base.html' %}
{% block content %}
<form method="post">
{% csrf_token %}
<div class="form-group form-group-lg">
<div class="input-group input-group-lg col-12">
<select id="id_select2" class="form-control selectpicker" name="options[]"
multiple="multiple" data-live-search="true">
<option data-tokens="123" value="456">Test</option>
</select>
</div>
</div>
</form>
{% endblock %}
{% block scripts %}
<script>
$(document).ready(function () {
$('#id_select2').select2();
});
</script>
{% endblock %}
我知道这个问题是因为有两个名称和参数完全相同的函数。
我建议您将 select2(脚本)的导入放在 html 的正文中,就在您自己的脚本标签之前
:D