JimBob
JimBob

Reputation: 175

Dynamic updating & HTMX

I have this form setup

enter image description here

This is what I want to happen; when the user selects an "Indoor Manufacturer" it then provides a list of "Indoor Models" that belongs to the "Indoor Manufacturer". The same thing for "Outdoor Manufacturer" & its Corresponding "Outdoor Models"

I can get the above to work fine using HTMX using my code below

However, the next step is to add to the HTMX the "Indoor/ Outdoor Same" checkbox, which will copy the data from "Indoor Manufacturer" to "Outdoor Manufacturer".

I tried implementing the basics of what I know, but it's not quite doing what I want - in that it is copying over the data, but only once on the first load

forms

from django import forms from.models import Maintenance from . import models from units.models import System, Cooler, Make from installs.models import Install from bootstrap_datepicker_plus import DatePickerInput, DateTimePickerInput from dynamic_forms import DynamicField, DynamicFormMixin

class CreateSystem(DynamicFormMixin, forms.ModelForm):

    def indoor_choices(form):
        owner = form['indoor_manufacturer'].value()
        return Cooler.objects.filter(manufacturer=owner, in_out="indoor")

    def indoor_initial(form):
        owner = form['indoor_manufacturer'].value()
        return Cooler.objects.filter(manufacturer=owner, in_out="indoor").first()  

    def outdoor_choices(form):
        owner = form['outdoor_manufacturer'].value()
        return Cooler.objects.filter(manufacturer=owner, in_out="outdoor")

    def outdoor_initial(form):
        owner = form['outdoor_manufacturer'].value()
        #print (form['outdoor_manufacturer'].value())
        return Cooler.objects.filter(manufacturer=owner, in_out="outdoor").first()

    def outdoor_manufacturer_choices(form):
        same_mamanufacturer = (form['manufacturer_boolean'].value())
        condition = (form['indoor_manufacturer'].value())
        if same_mamanufacturer is False:
            return Make.objects.all()
        else:
            return Make.objects.filter(id=condition)

    manufacturer_boolean = forms.BooleanField(
        initial=True, 
        widget=forms.CheckboxInput(attrs={
            'class':'form-control', 
            'autocomplete': 'off',
            'hx-get': '/companies/indoor_manufacturer/',
            'hx-target': '#id_outdoor_manufacturer'}))

    indoor_manufacturer = forms.ModelChoiceField(
        queryset=Make.objects.all(),
        initial=Make.objects.first(), 
        widget=forms.Select(
            attrs={
            'class': 'form-control', 
            'autocomplete': 'off', 
            'hx-get': '/companies/indoor_coolers/', 
            'hx-target': '#id_indoor_cooler'}))

    outdoor_manufacturer = DynamicField(forms.ModelChoiceField,
        queryset=outdoor_manufacturer_choices,
        widget=forms.Select(
            attrs={
            'class': 'form-control', 
            'autocomplete': 'off', 
            'hx-get': '/companies/outdoor_coolers/',
            'hx-target': '#id_outdoor_cooler'}))

    indoor_cooler = DynamicField(forms.ModelChoiceField, 
        queryset=indoor_choices, 
        initial=indoor_initial, 
        widget=forms.Select(
            attrs={
            'class': 'form-control'}))

    outdoor_cooler = DynamicField(forms.ModelChoiceField, 
        queryset=outdoor_choices, 
        initial=outdoor_initial, 
        widget=forms.Select(
            attrs={
            'class': 'form-control'}))

    class Meta:
        model   = System
        fields  = ['manufacturer_boolean','outdoor_manufacturer','indoor_manufacturer','indoor_cooler','outdoor_cooler']

urls

from django.urls import path, re_path
from.import views

urlpatterns = [
    path('', views.company_list, name='companies'),
    path('zones/', views.zone_list, name='zone_list'),
    path('zones/<int:id>', views.zone_detail, name='zone_detail'),
    path('create/', views.company_create, name="company_create"),
    path('<int:id>/', views.company_detail, name="company_detail"),
    path('<int:id>/update/', views.company_update, name="company_update"),
    path('<int:id>/system_detail/', views.system_detail, name="system_detail"),
    path('<int:id>/system_create/', views.system_create, name="system_create"),
    path('<int:id>/install_create/', views.install_create, name="install_create"),

    path('indoor_coolers/', views.indoor_coolers, name='indoor_coolers'),
    path('outdoor_coolers/', views.outdoor_coolers, name='outdoor_coolers'),
    path('manufacturer_boolean/', views.manufacturer_boolean, name='manufacturer_boolean'),
    path('indoor_manufacturer/', views.indoor_manufacturer, name='indoor_manufacturer'),
]

views

from django.shortcuts import render, redirect
from django.contrib.auth.decorators import login_required
from.models import Customer, Zone
from units.models import System, Maintenance, Cooler, Make
from units.forms import CreateSystem
from installs.models import Install
from django.http import HttpResponse, JsonResponse
from .import forms
from dateutil.relativedelta import relativedelta
import datetime

def system_create(request, id):

    page_live = False
    user_active_required = True

    if not request.user.userprofile.is_verified and user_active_required:
        return redirect('accounts:activate')

    elif not request.user.is_staff and not page_live  :
        return redirect('coming_soon')

    else:

        owner_id = id
        customer = Customer.objects.get(id = id)

        if request.method == 'POST':
            form = CreateSystem(request.POST)
            if form.is_valid():
                #add this data later
        else:
            form = CreateSystem()
            
        return render(request, 'systems/system_create.html',{'form':form, 'owner_id':owner_id,
            'customer':customer,})

def indoor_coolers(request):
    form = CreateSystem(request.GET)
    return HttpResponse(form['indoor_cooler'])

def outdoor_coolers(request):
    form = CreateSystem(request.GET)
    return HttpResponse(form['outdoor_cooler'])

def manufacturer_boolean(request):
    form = CreateSystem(request.GET)
    return HttpResponse(form['manufacturer_boolean'])

def indoor_manufacturer(request):
    form = CreateSystem(request.GET)
    return HttpResponse(form['indoor_manufacturer'])

Upvotes: 0

Views: 601

Answers (1)

JimBob
JimBob

Reputation: 175

I added a "change" trigger for both #id_outdoor_manufacturer & #id_manufacturer_boolean, so it listens to any changes then runs the outdoor_manufacturer_choices if/ else conditions

Upvotes: 0

Related Questions