【发布时间】:2019-03-14 11:16:18
【问题描述】:
抱歉,我无法提供更准确的主题标题,我必须承认我还是个 Django 新手。
我正在尝试使用 Ajax 和具有拆分视图的模板,但我无法以一种或另一种方式实现我想要的。
我的目标是能够使用呈现的模板和 jquery 隐藏/显示指令,但我在某些时候失败了。
这是我的 urls.py:
from django.urls import path
from django.conf.urls import url
from . import views, inventory
urlpatterns = [
path('', views.index, name='index'),
url(r'^inventory', inventory.inventory, name='inventory'),
url(r'^buildInventory', inventory.buildInventory, name='buildInventory'),
]
我的视图索引呈现一个模板化的“index.html”(我为插图删除了一个上下文):
def index(request):
return render(request, 'myapp/index.html', context)
我的 index.html 文件:
{% extends "base.html" %}
{% load static %}
{% block delivery_form %}
<div id="mainblock">
....
</div>
{% endblock %}
我的 base.html 主要包含我的静态和标题:
{% load static %}
<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="shortcut icon" type="image/png" href="http://web-iec/favicon.ico"/>
<link rel="stylesheet" type="text/css" href="{% static 'myapp/css/nice.css' %}">
<script type="text/javascript" src="{% static 'myapp/js/jquery.js' %}" ></script>
<script type="text/javascript" src="{% static 'myapp/js/jquery-ui.js' %}" ></script>
<script type="text/javascript" src="{% static 'myapp/js/inventory.js' %}" ></script>
<script type="text/javascript" src="{% static 'myapp/js/homepage.js' %}" ></script>
</head>
<body>
<div class="navBar">
<span class="navBtn" id="listDeplVer" title="Inventory">Inventory</span>
</div>
<div style="min-height: 100%;margin-bottom: -20px;">
{% block delivery_form %}
{% endblock %}
{% block inventory %}
{% endblock %}
</div>
</body>
</html>
现在我想要实现的是,在我的 inventory.js 中,我有一个 onclick 事件,我试图用它来隐藏主页内容并将其替换为我的 inventory.py 视图中呈现的 html与相关的 html:
我的库存.py:
def inventory(request):
return render(request, 'myapp/inventory.html')
还有我的inventory.html:
{% extends "base.html" %}
{% load static %}
{% block inventory %}
<div id="inventoryblock">
// html
</div>
{% endblock %}
最后我的 inventory.js 看起来像:
$(document).ready(function () {
$( "#listDeplVer" ).click( function () {
$.ajax({
type: 'GET',
dataType: 'html',
url: '/myapp/inventory',
beforeSend: function(){
$("#mainblock").fadeOut();
},
success : function(output){
$("#inventoryblock").html(output);
},
});
});
就像我说的那样,我期望 onclick 我的页面内容被呈现的库存页面替换,但这不起作用。
使用网络开发工具时,如果我在新标签页中打开库存的 XHR 请求,它工作得很好,所以我认为我做错了。
在将所有内容合并到一个文件中(js、视图、html 等)之前,我想问一下是否有类似工作的方法?
感谢您的帮助
【问题讨论】:
标签: javascript jquery html django django-templates