Intis/django-htmx-presenatation
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Swap content

Browse Source
This commit is contained in:
Eden Kirin
2024-04-06 16:46:24 +02:00
parent ae2612cfd6
commit f2dc83caab
9 changed files with 93 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
project/main/templates/main/base/base.html
View File

@ -8,7 +8,7 @@
<script src="https://unpkg.com/htmx.org@1.9.11" integrity="sha384-0gxUXCCR8yv9FM2b+U3FDbsKthCI66oH5IA9fHppQq9DDMHuMauqq1ZHBpJxQ0J0" crossorigin="anonymous"></script> <script src="https://unpkg.com/htmx.org@1.9.11" integrity="sha384-0gxUXCCR8yv9FM2b+U3FDbsKthCI66oH5IA9fHppQq9DDMHuMauqq1ZHBpJxQ0J0" crossorigin="anonymous"></script>
<title>{{ title or "Django-html demo" }}</title> <title>{{ title or "Django-html demo" }}</title>
</head> </head>
<body> <body hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'>
{% block body_content %}{% endblock %} {% block body_content %}{% endblock %}
</body> </body>
</html> </html>

3
project/main/templates/main/components/nav.html
View File

@ -9,10 +9,11 @@
{% endmacro %} {% endmacro %}
<div class="list-group list-group-flush"> <div class="list-group list-group-flush">
{{ render_item("Swap Content", "swap-content") }} {{ render_item("Swap Content", "swap") }}
{{ render_item("Form Validation", "form-validation") }} {{ render_item("Form Validation", "form-validation") }}
{{ render_item("Complex Form", "complex-form") }} {{ render_item("Complex Form", "complex-form") }}
{{ render_item("Filter List", "filter-list") }} {{ render_item("Filter List", "filter-list") }}
{{ render_item("Table Inline Edit", "table-inline-edit") }} {{ render_item("Table Inline Edit", "table-inline-edit") }}
{{ render_item("Back to Home", "home") }}
</div> </div>
{% endmacro %} {% endmacro %}

2
project/main/templates/main/home.html
View File

@ -25,7 +25,7 @@
</ul> </ul>
<h4 class="mt-5"> <h4 class="mt-5">
<a href="{{ url("swap-content") }}"> <a href="{{ url("swap") }}">
Start demo Start demo
</a> </a>
</h4> </h4>

24
project/main/templates/main/swap.html Normal file
View File

@ -0,0 +1,24 @@
{% extends "main/base/layout.html" %}
{% block content %}
{% macro render_btn(title, cls, content) %}
<button
type="button"
class="btn {{ cls }} mb-3"
hx-post="{{ url("swap") }}?content={{ content }}"
hx-target="#swap-content-target"
>
{{ title }}
</button>
{% endmacro %}
{{ render_btn(title="Initial", cls="btn-outline-secondary", content="initial") }}
{{ render_btn(title="Swap to content 1", cls="btn-info", content="info") }}
{{ render_btn(title="Swap to content 2", cls="btn-warning", content="warning") }}
{{ render_btn(title="Swap to content 3", cls="btn-danger", content="danger") }}
<div id="swap-content-target">
{% include("main/swap_content.html") %}
</div>
{% endblock %}

48
project/main/templates/main/swap_content.html
View File

@ -1,8 +1,42 @@
{% extends "main/base/layout.html" %} {% if content == "info" %}
<p class="alert alert-info">
Bacon ipsum dolor amet cow capicola pancetta picanha biltong brisket filet mignon
{% block content %} turducken beef ribs burgdoggen landjaeger meatball venison shank.
<p> Capicola ham pork chop, biltong kielbasa pancetta short loin jowl cupim pig
This is some swappable content bellow. jerky drumstick turducken burgdoggen beef. Spare ribs flank ribeye cow doner,
shank chuck bacon ham hock porchetta kielbasa tri-tip. Ham t-bone chislic,
capicola andouille ham hock frankfurter tri-tip sausage kevin landjaeger shank ribeye.
Swine tri-tip spare ribs, rump flank bresaola kevin tail. Meatball tail picanha cow,
frankfurter ribeye sirloin pork belly short loin pig. Filet mignon spare ribs pastrami,
tri-tip ball tip tongue fatback pork chop.
</p> </p>
{% endblock %} {% elif content == "warning" %}
<p class="alert alert-warning">
Beef ribs bacon sausage meatloaf pork belly kielbasa frankfurter ball tip
corned beef boudin. Ribeye turducken corned beef, ground round picanha doner
kielbasa fatback alcatra. Bresaola shankle ribeye meatloaf sirloin
alcatra short ribs chislic shank turkey brisket chicken. Andouille rump tongue,
landjaeger biltong brisket tail turkey leberkas jowl beef ribs corned beef.
Venison meatball pig short ribs, alcatra cow tenderloin. Leberkas fatback biltong,
pig rump doner short loin tongue filet mignon brisket tri-tip. Alcatra meatloaf biltong
drumstick capicola chislic chuck short ribs fatback ribeye turkey kevin.
</p>
{% elif content == "danger" %}
<p class="alert alert-danger">
Ham hock bacon short loin shank pork loin filet mignon kevin tongue. Chicken andouille
beef pork loin strip steak meatball jerky burgdoggen shoulder picanha. Pork belly tri-tip doner,
chicken frankfurter burgdoggen jerky t-bone. Chicken chuck hamburger tail shank burgdoggen.
Tenderloin biltong pork chop, sirloin leberkas pastrami salami jerky jowl tri-tip corned beef
ground round venison spare ribs chicken.
</p>
{% else %}
<p class="alert">
Bacon shankle cupim biltong, burgdoggen hamburger meatloaf frankfurter tenderloin
landjaeger jerky capicola. Leberkas shoulder tri-tip sausage andouille hamburger cow
prosciutto beef ribs drumstick chicken. Capicola hamburger pork landjaeger burgdoggen.
Cupim jerky shank tongue fatback ham corned beef leberkas turkey meatloaf rump pig
ball tip bacon. Ham hock buffalo doner, shankle landjaeger kielbasa chicken pork
loin jowl leberkas alcatra chuck prosciutto brisket andouille. Pancetta meatloaf
shankle burgdoggen.
</p>
{% endif %}

2
project/main/views/__init__.py
View File

@ -2,5 +2,5 @@ from .complex_form import ComplexFormView
from .filter_list import FilterListView from .filter_list import FilterListView
from .form_validation import FormValidationView from .form_validation import FormValidationView
from .home import HomeView from .home import HomeView
from .swap_content import SwapContentView from .swap import SwapView
from .table_inline_edit import TableInlineEditView from .table_inline_edit import TableInlineEditView

22
project/main/views/swap.py Normal file
View File

@ -0,0 +1,22 @@
from django.shortcuts import render
from django.core.handlers.wsgi import WSGIRequest
from django.http import HttpResponse
from project.main.views.demo_view_base import DemoViewBase
class SwapView(DemoViewBase):
template_name = "main/swap.html"
active_section = "swap"
title = "Swap"
def post(self, request: WSGIRequest, *args, **kwargs) -> HttpResponse:
context = {
"content": request.GET.get("content", "info")
}
return render(
request=request,
context=context,
template_name="main/swap_content.html",
)

7
project/main/views/swap_content.py
View File

@ -1,7 +0,0 @@
from project.main.views.demo_view_base import DemoViewBase
class SwapContentView(DemoViewBase):
template_name = "main/swap_content.html"
active_section = "swap-content"
title = "Swap Content"

2
project/urls.py
View File

@ -4,7 +4,7 @@ from project.main import views
urlpatterns = [ urlpatterns = [
path("", views.HomeView.as_view(), name="home"), path("", views.HomeView.as_view(), name="home"),
path("swap-content", views.SwapContentView.as_view(), name="swap-content"), path("swap", views.SwapView.as_view(), name="swap"),
path("filter-list", views.FilterListView.as_view(), name="filter-list"), path("filter-list", views.FilterListView.as_view(), name="filter-list"),
path("form-validation", views.FormValidationView.as_view(), name="form-validation"), path("form-validation", views.FormValidationView.as_view(), name="form-validation"),
path("complex-form", views.ComplexFormView.as_view(), name="complex-form"), path("complex-form", views.ComplexFormView.as_view(), name="complex-form"),