38 |
39 |
40 | * [Filtrar com dropdowns dependentes](#filtrar-com-dropdowns-dependentes)
41 |
42 | 
43 |
44 |
45 | * [Adicionar itens](#adicionar-itens)
46 |
47 | 
48 |
49 |
50 | * [Pagar (editar) vários itens (Bulk Update)](#pagar-editar-vários-itens-bulk-update)
51 |
52 | 
53 |
54 |
55 | * [Editar um item](#editar-um-item)
56 |
57 | 
58 |
59 |
60 | * [Deletar um item](#deletar-um-item)
61 |
62 | 
63 |
64 |
65 | * [client-side-templates](#client-side-templates)
66 |
67 | * [Bookstore (modal)](#bookstore)
68 |
69 | * [Like e unlike](#like-e-unlike)
70 |
71 | * [Criar categoria](#criar-uma-nova-categoria)
72 |
73 | * [Trocar de categoria](#trocar-a-categoria)
74 |
75 |
76 | ## Passo a passo
77 |
78 | ### Clonando o projeto base
79 |
80 | ```
81 | git clone https://github.com/rg3915/django-htmx-tutorial.git
82 | cd django-htmx-tutorial
83 | git checkout passo-a-passo
84 |
85 | python -m venv .venv
86 | source .venv/bin/activate
87 |
88 | pip install -U pip
89 | pip install -r requirements.txt
90 | pip install ipdb
91 |
92 | python contrib/env_gen.py
93 |
94 | python manage.py migrate
95 | python manage.py createsuperuser --username="admin" --email=""
96 | ```
97 |
98 | Vamos editar:
99 |
100 | * base.html
101 | * nav.html
102 | * index.html
103 |
104 |
105 | Em `base.html` escreva
106 |
107 | ```html
108 |
109 |
110 |
111 |
112 | ```
113 |
114 | Em `nav.html` escreva
115 |
116 | ```html
117 | | Região | 221 |
|---|
| 230 | {{ region.1 }} 231 | | 232 |
| Estados | 243 |
|---|
Despesas CRUD com SPA
678 | ``` 679 | 680 | Descomente `urls.py` 681 | 682 | ```python 683 | path('expense/', include('backend.expense.urls', namespace='expense')), 684 | ``` 685 | 686 | 687 | --- 688 | 689 | ### Pagar (editar) vários itens (Bulk Update) 690 | 691 |  692 | 693 | Vamos editar: 694 | 695 | * views.py 696 | * urls.py 697 | * expense_list.html 698 | 699 | 700 | Escreva o `expense/views.py` 701 | 702 | ```python 703 | @require_http_methods(['POST']) 704 | def expense_paid(request): 705 | ids = request.POST.getlist('ids') 706 | 707 | # Edita as despesas selecionadas. 708 | Expense.objects.filter(id__in=ids).update(paid=True) 709 | 710 | # Retorna todas as despesas novamente. 711 | expenses = Expense.objects.all() 712 | 713 | context = {'object_list': expenses} 714 | return render(request, 'expense/expense_table.html', context) 715 | 716 | 717 | @require_http_methods(['POST']) 718 | def expense_no_paid(request): 719 | ids = request.POST.getlist('ids') 720 | 721 | # Edita as despesas selecionadas. 722 | Expense.objects.filter(id__in=ids).update(paid=False) 723 | 724 | # Retorna todas as despesas novamente. 725 | expenses = Expense.objects.all() 726 | 727 | context = {'object_list': expenses} 728 | return render(request, 'expense/expense_table.html', context) 729 | ``` 730 | 731 | Escreva o `expense/urls.py` 732 | 733 | ```python 734 | path('expense/paid/', v.expense_paid, name='expense_paid'), 735 | path('expense/no-paid/', v.expense_no_paid, name='expense_no_paid'), 736 | ``` 737 | 738 | Escreva o `expense/expense_list.html` 739 | 740 | ```html 741 | 742 | 757 | ``` 758 | 759 | --- 760 | 761 | ### Editar um item 762 | 763 |  764 | 765 | Vamos editar: 766 | 767 | * views.py 768 | * urls.py 769 | * hx/expense_hx.html 770 | * hx/expense_detail.html 771 | 772 | 773 | Escreva o `expense/views.py` 774 | 775 | ```python 776 | # expense/views.py 777 | def expense_detail(request, pk): 778 | template_name = 'expense/hx/expense_detail.html' 779 | obj = Expense.objects.get(pk=pk) 780 | form = ExpenseForm(request.POST or None, instance=obj) 781 | 782 | context = {'object': obj, 'form': form} 783 | return render(request, template_name, context) 784 | 785 | 786 | def expense_update(request, pk): 787 | template_name = 'expense/hx/expense_hx.html' 788 | obj = Expense.objects.get(pk=pk) 789 | form = ExpenseForm(request.POST or None, instance=obj) 790 | context = {'object': obj} 791 | 792 | if request.method == 'POST': 793 | if form.is_valid(): 794 | form.save() 795 | 796 | return render(request, template_name, context) 797 | ``` 798 | 799 | 800 | Escreva o `expense/urls.py` 801 | 802 | ```python 803 | # expense/urls.py 804 | path('| Descrição | 975 |Valor | 976 |Pago | 977 |
|---|---|---|
| { description } | 986 |{ value } | 987 |988 | 989 | 990 | { #paid } { /paid } 991 | { ^paid } { /paid } 992 | | 993 |
| Descrição | 1104 |Valor | 1105 |Pago | 1106 |
|---|---|---|
| {{ description }} | 1115 |{{ value }} | 1116 |1117 | 1118 | 1119 | {{ #paid }} {{ /paid }} 1120 | {{ ^paid }} {{ /paid }} 1121 | | 1122 |
| Título | 1298 |Autor | 1299 |Ações | 1300 |
|---|
Título 1525 | {{ object.title }} 1526 |
1527 |Autor 1528 | {{ object.author|default:'---' }} 1529 |
1530 || Produto | 2089 |Categoria | 2090 |
|---|