python - 当我们从 django 的依赖下拉列表中选择对象时，如何获取一个对象

Question

（我正在研究 Django 中的依赖下拉列表）我有两个下拉列表，第一个是 Company，第二个是 Car。当我从第一个下拉列表中选择公司名称时，例如丰田，所有汽车都与丰田公司相关，当我从第二个下拉列表（汽车下拉列表）中选择任何汽车时，它对丰田没有任何显示我只需要我选择的一辆汽车，怎么能我这样做？任何人都可以帮忙吗？

它显示这样的空白页面

这是我的代码

模型.py

      class Car(models.Model):
         CarID = models.AutoField(primary_key=True)
         CarName = models.CharField(max_length=500, blank=True, null=True, verbose_name="Car Name")
         company = models.ForeignKey(Company, verbose_name="Company Name", on_delete=models.CASCADE, default="")
         type = models.ForeignKey(CarType, verbose_name="Vehicle Type", on_delete=models.CASCADE)
         CarImage = models.ImageField(upload_to='productimg', verbose_name="Vehicle Image")
         RefNo = models.CharField(max_length=500,verbose_name="Ref No", null=True, blank=True)
         ChassisNo = models.CharField(max_length=500,verbose_name="Chassis No", null=True, blank=True)
         ModelCode = models.CharField(max_length=500,verbose_name="Model Code", null=True, blank=True)
         EngineSize = models.CharField(max_length=500,verbose_name="Engine Size", null=True, blank=True)
         Location = models.CharField(max_length=500,verbose_name="Location", null=True, blank=True)
         Version = models.CharField(max_length=500,verbose_name="Version/Class", null=True, blank=True)
         Drive = models.CharField(max_length=500,verbose_name="Drive", null=True, blank=True)
         Transmission = models.CharField(max_length=500,verbose_name="Transmission", null=True, blank=True)
         mfdate = models.DateField(auto_now_add=False, blank= True,null=True, verbose_name="Manufacturing Date")
         Mileage = models.CharField(max_length=500,verbose_name="Mileage", null=True, blank=True)
         EngineCode = models.CharField(max_length=500,verbose_name="Engine Code", null=True, blank=True)
         steering = models.ForeignKey(Steering, verbose_name="Steering", on_delete=models.CASCADE, default="")        
         ExtColor = models.CharField(max_length=500,verbose_name="Ext Color", null=True, blank=True)
         Fuel = models.CharField(max_length=500,verbose_name="Fuel", null=True, blank=True)
         Seats = models.CharField(max_length=500,verbose_name="Seats", null=True, blank=True)
         Door = models.CharField(max_length=500,verbose_name="Door", null=True, blank=True)
         M3 = models.CharField(max_length=500,verbose_name="M3", null=True, blank=True)
         Dimensions = models.CharField(max_length=500,verbose_name="Dimensions", null=True, blank=True)
         Weight = models.CharField(max_length=500,verbose_name="Vehicle Weight", blank=True, null=True)
         MaxCap = models.CharField(max_length=500,verbose_name="Max Capicity", null=True, blank=True)
         country = models.ForeignKey(Country, verbose_name="CountryName", on_delete=models.CASCADE, default="")
         pricerange = models.ForeignKey(PriceRange, verbose_name="Price Range", on_delete=models.CASCADE, default="")
         discount = models.ForeignKey(Discount, verbose_name="By Discount", on_delete=models.CASCADE, default="")
         othercategorie = models.ForeignKey(OtherCategorie, verbose_name="Other Categories", on_delete=models.CASCADE, default="")
         Description = models.TextField(verbose_name="Description", null=True, blank=True)
         Price = models.CharField(max_length=500,verbose_name="Vehicle Price", null=True, blank=True)
         TotalPrice = models.CharField(max_length=500,verbose_name="Total Price", null=True, blank=True)

         @staticmethod
         def get_all_cars():
             return Car.objects.all()

         @staticmethod
         def get_all_cars_by_CompanyId(company_id):
             if company_id:
                 return Car.objects.filter(company=company_id)
             else:
                 return Car.get_all_cars()

         def __str__(self):
             return self.CarName

视图.py

  def searchdd(request):

    carForm = Car.objects.all()   
    companyname = request.POST.get('company_ddl')
    carname = request.POST.get('car_name')

   if request.method == "POST":
       carForm = Car.objects.filter(company=companyname)

       context = {'carForm':carForm} 
       return render(request, 'app/searchdd.html', context)

    # **this method for select just one car against company**
   if request.method == "POST":      
       carForm = Car.objects.filter(CarName=carname)
    
       context = {'carForm':carForm} 
       return render(request, 'app/searchdd.html', context)

主页.html

     <form method="post" id="indexForm" action="/searchdd" data-cars-url="{% url 'ajax_load_cars' %}">
    {% csrf_token %}
  <div class="col-md-12">
    <div class="row">
     
      <div class=" col-md-3">
        <label for="" class="white">Make</label>
        <select id="companyddl" name="company_ddl" class="searchengine dp-list">              
          <option disabled selected="true" value="">--Select Make--</option>            
          {% for company in companies %}             
          <option value="{{company.CompanyID}}">{{company.CompanyName}}</option>              
          {% endfor %}              
        </select>
      </div>

      <div class=" col-md-3">
        <label for="" class="white">Model</label>
        <select id="carddl" name="car_name" class="searchengine dp-list">
          <option disabled selected="true" value="">--Select Model--</option>                           
        </select>
      </div>
      </div>
             <div class=" col-md-3">
        <label class="white">Search </label>            
        <button class="btn-dark" type="submit" value="search"><i class="fa fa-search"></i>&nbsp;&nbsp;Search Here&nbsp;&nbsp;</button>            
      </div>
      </div>

网址.py

  urlpatterns = [
     path('', views.home, name='home'),
     path('search', views.search, name='search'),    
     path('load-cars', views.load_cars, name='ajax_load_cars'),
     path('searchdd', views.searchdd, name='searchdd'),
  ] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

标签： pythondjangodjango-views

Answer 1

做这样的事情：HTML

                <div>
                  <h5 class="mb-2">Company</h5>
                  <select id="company" name="company">
                    <option label="Select category" selected hidden></option>
                    <option value="Toyota" id=Toyota">Toyota</option>
                    <option value="Honda" id="Honda">Honda</option>
                    <option value="Ford" id="Ford">Ford</option>
                  </select>
                </div>
                <div>
                  <h5 class="my-2">Car</h5>
                  <select id="car" name="car">
                    <option label="Select a Category First" selected>
                  </select>
                </div>

JavaScript：

obj = {"Toyota":["Corolla","Supra"],"Honda":["Civic","Accord"],"Ford":["Mustang","GT"]}
document.getElementById("category").addEventListener("change", function () {
      var category = document.getElementById("company").value;
      var str = `<option label="Select car" value="" selected="" hidden=""></option>`;
      sub = obj[company];
      //console.log(sub);
      sub.forEach(function (value) {
        temp = `<option value="${value}" id="${value}">${value}</option>`;
        str = str + temp;
      })
      document.getElementById("car").innerHTML = str;
      document.getElementById("car").style.display = "block";
    })