Django-LiveView/docs
1
0
Fork 0
mirror of https://github.com/Django-LiveView/docs.git synced 2024-12-22 19:05:35 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

Update

Browse Source
This commit is contained in:
Andros Fenollosa 2024-03-19 17:09:00 +01:00
parent afd567fa46
commit ea21007d5e
1 changed files with 52 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
one.org
View File

@ -427,7 +427,6 @@ For example, you can create a link to the ~blog single~ page with the ~slug~ of
#+BEGIN_SRC html
<a
data-controller="page"
data-action="click->page#changePage"
data-page="blog_single"
data-slug="{{ article.slug }}"
@ -796,10 +795,10 @@ Now we will create the base template, which will be the one that will be rendere
Create a folder called ~templates~, or use your template folder, inside your App and inside it create another folder called ~layouts~. Now create a file called ~base.html~.
#+BEGIN_SRC html
{# my-app/templates/layouts/base.html #}
{% load static i18n %}
<!doctype html>{% get_current_language as CURRENT_LANGUAGE %}
<html lang="{{ CURRENT_LANGUAGE }}">
{# my-app/templates/layouts/base.html #}
{% load static i18n %}
<!doctype html>{% get_current_language as CURRENT_LANGUAGE %}
<html lang="{{ CURRENT_LANGUAGE }}">
<head>
<meta charset="utf-8">
<title>{{ title }}</title>
@ -820,6 +819,7 @@ Create a folder called ~templates~, or use your template folder, inside your App
<body
data-host="{{ request.get_host }}"
data-debug="{{ DEBUG }}"
data-controller="page"
>
<section id="loading"></section>
<section id="notifications" class="notifications"></section>
@ -834,7 +834,7 @@ Create a folder called ~templates~, or use your template folder, inside your App
</footer>
</div>
</body>
</html>
</html>
#+END_SRC
In the future we will define ~main.js~, a minimal JavaScript to connect the events and the WebSockets client.
@ -846,15 +846,19 @@ We will create the home page template, which will be the one that will be render
Create a folder called ~pages~ in your template folder and inside it create a file called ~home.html~.
#+BEGIN_SRC html
{# my-app/templates/pages/home.html #}
{% load static %}
{# my-app/templates/pages/home.html #}
{% load static %}
<main data-controller="home">
<main>
<p>
<button data-action="click->home#randomNumber">Random number</button>
<button
data-action="click->page#run"
data-liveview-action="home"
data-liveview-function="random_number"
>Generate random number</button>
</p>
<h2 id="output-random-number"></h2>
</main>
</main>
#+END_SRC
As you can see, we have defined a button to launch the action of generating the random number (~button~) and the place where we will print the result (~output-random-number~).