在按钮单击时将多个模板加载到 django 中的基本模板中

调整

我有几个应用程序(app1.html、app2.html 等)和一个 base.html,它有(假设)4 个占位符。现在我想通过单击占位符之一来启用用户以从这些应用程序中进行选择并将它们加载到该占位符中。为了更清楚,这是一个简单的 js 示例:https : //jsfiddle.net/eja4t0gb/15/

HTML:

  <body>
    <div id="module-1" class="">
      This is module 1.
      <button id="load-1">Load Module</button>
    </div>
    ---
    <div id="module-2" class="">
      This is module 2.
      <button id="load-2">Load Module</button>
    </div>
    ---
    <div id="module-3" class="">
      This is module 3.
      <button id="load-3">Load Module</button>
    </div>
    ---
    <div id="module-4" class="">
      This is module 4.
      <button id="load-4">Load Module</button>
    </div>
    --- ---
    <div id="chooser">
      Choose an App.
      <button id="app-1">App-1</button>
      <button id="app-2">App-2</button>
      <button id="app-3">App-3</button>
      <button id="app-4">App-4</button>
    </div>
  </body>
</html>

Javascript:

var chosenModule = null;
document.getElementById("chooser").style.display = "none";

for (let i = 1; i <= 4; i++) {
  document.getElementById("load-" + i).addEventListener("click",
    function() {
      chosenModule = i;
      document.getElementById("chooser").style.display = "block";
    });
}

for (let i = 1; i <= 4; i++) {
  document.getElementById("app-" + i).addEventListener("click",
    function() {
      loadApp(i);
      document.getElementById("chooser").style.display = "none";
      document.getElementById("app-" + i).style.display = "none";
    });
}

function loadApp(i) {
  document.getElementById('module-' + chosenModule).innerHTML = "App" + i;
}

这是我的问题:我将如何使用 django 模板/Jinja2 实现这一点?

现在我看到了这篇文章:Django: Loading another template on click a button,然而,目标是加载一个全新的页面。另一方面,我只想在单击按钮后额外加载应用程序及其所有资源,而不必重新加载页面本身。我知道 {% include 'app.html' %},但我怎么能告诉 base.html 只在点击按钮/通过 js 代码后解释这个?或者是“包含”这里的错误方法?

德旺帕迪亚尔

实际上,Django 模板适用于无状态的HTTP 协议这意味着一旦你渲染了它,你就不能得到其他模板!但是,你可以使用 ajax 请求从你的 web 应用程序中获取 django 模板。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

在Django模板中相乘

来自分类Dev

来自ImageField的图像未加载到Django模板中

来自分类Dev

模板中的Django dict

来自分类Dev

有没有一种方法可以为Django中的所有模板指定默认的基本模板?

来自分类Dev

将2个子模板集成并呈现到基本模板中-Django

来自分类Dev

与Django模板中的路径混淆

来自分类Dev

检测Django模板中模板使用的语言

来自分类Dev

如何在Django的子模板中更改基本模板的背景

来自分类Dev

在Django的基本模板中设置背景图片

来自分类Dev

可重用Django App中的基本模板

来自分类Dev

清单FOR中的Django模板IF

来自分类Dev

无法在Django的子模板中包含模板

来自分类Dev

Django中的模板变量

来自分类Dev

来自ImageField的图像未加载到Django模板中

来自分类Dev

模板中的Django dict

来自分类Dev

在Django中组合这些基本模板的正确方法?

来自分类Dev

Django模板中的NameError

来自分类Dev

Django-使用jQuery将模板加载到变量中

来自分类Dev

django模板中的原始文本保留了基本格式

来自分类Dev

django分组中的模板

来自分类Dev

检测Django模板中模板使用的语言

来自分类Dev

在Django的基本模板中设置背景图片

来自分类Dev

模板中的Django forloop

来自分类Dev

基本模板中的Django表单。如何显示验证错误?

来自分类Dev

Django 表单字段未加载到模板中

来自分类Dev

访问从 django 中的模板呈现模板的视图

来自分类Dev

如何使用包含标签避免 RecursionError 将表单加载到 django 基本模板?

来自分类Dev

将 requests.get 的结果加载到 django 模板(tableau)中?

来自分类Dev

django 模板中的 if 语句

Related 相关文章

热门标签

归档