如何对依赖下拉列表发出ajax请求

dldeef67  于 2021-09-13  发布在  Java
关注(0)|答案(0)|浏览(264)

我是编程和学习django的新手。我正在努力理解如何发出ajax请求来获取数据以创建相关下拉列表。我环顾了谷歌的各种搜索和stackoverflow,但看着它们我会更加困惑。因此,我无法继续获取依赖值
我的html代码如下所示

  1. <select name ="services" id="serviceA">
  2. <option disabled selected="true"> -- Select Category -- </option>
  3. {% for item in serv %}"
  4. <option value="{{ item.id }}" >{{ item.name }}</option>
  5. {% endfor %}
  6. </select>
  7. <select name ="subcategories" id="subcategoryA">
  8. <option disabled selected="true"> -- Select Service -- </option>
  9. {% for item2 in subcategory %}"
  10. <option value="{{ item2.id }}" >{{ item2.name }}</option>
  11. {% endfor %}
  12. </select>

my views.py看起来像这样

  1. def book(request):
  2. employees = Employee.objects.values_list('name',flat=True)
  3. services_ = Service.objects.values_list('name',flat=True)
  4. services = []
  5. serv = Service.objects.all().order_by('-id')
  6. subcategory = SubCategory.objects.all().order_by('-id')
  7. # subcategory = SubCategory.objects.get(pk=request.GET('service_pk'))
  8. for i in services_:
  9. services.append(i)
  10. context = {
  11. 'employees':employees,
  12. 'services':services,
  13. 'serv':serv,
  14. 'subcategory':subcategory,
  15. }
  16. return render(request,'book.html',context=context)

my URL.py的设置与其他设置类似

  1. path('service/<int:service>', services, name='services'),

我的models.py看起来像这样

  1. def rand_slug():
  2. return ''.join(random.choice(string.ascii_letters + string.digits) for _ in range(8))
  3. # Create your models here.
  4. def path_and_rename(instance, filename):
  5. upload_to = 'uploads/images'
  6. ext = filename.split('.')[-1]
  7. # get filename
  8. if instance.pk:
  9. filename = '{}.{}'.format(instance.pk, ext)
  10. else:
  11. # set filename as random string
  12. filename = "PTB-" + '{}.{}'.format(uuid.uuid4().hex[:16], ext)
  13. # return the whole path to the file
  14. return os.path.join(upload_to, filename)
  15. class Service(models.Model):
  16. name = models.CharField(max_length=100,blank=True,null=True)
  17. description = models.CharField(max_length=100,blank=True,null=True)
  18. startprice = models.DecimalField(max_digits=10,default=0.00,decimal_places=2, verbose_name="Starts at")
  19. image = models.ImageField(upload_to=path_and_rename, unique=True, blank=True, null=True, max_length=255, help_text='Please upload picture of 1:1 ratio')
  20. def __str__(self):
  21. return self.name
  22. class SubCategory(models.Model):
  23. name = models.CharField(max_length=100,blank=True,null=True)
  24. description = models.CharField(max_length=100,blank=True,null=True)
  25. price = models.DecimalField(max_digits=10,default=0.00,decimal_places=2)
  26. image = models.ImageField(upload_to=path_and_rename, unique=True, blank=True, null=True, max_length=255, help_text='Please upload picture of 1:1 ratio')
  27. service = models.ForeignKey(Service, on_delete=models.CASCADE)
  28. slug = AutoSlugField(populate_from=name,max_length=255, unique=True)
  29. on_sale = models.BooleanField(default=False, blank=True, null=True)
  30. discount = models.IntegerField(blank=True,null=True)
  31. def save(self, *args,**kwargs):
  32. if not self.slug:
  33. self.slug = slugify(rand_slug() + "_" + (self.name.split().pop(0)))
  34. super(SubCategory, self).save(*args,**kwargs)
  35. class Meta:
  36. verbose_name = "Services List"
  37. verbose_name_plural = "Services Lists"
  38. def __str__(self):
  39. return self.name

现在,如何发出ajax请求,以便在更改服务字段时更改子类别选项?
更新我试图根据24:05 youtubelink的视频解决jquery,我的jquery脚本是这样的。但这不起作用。。。

  1. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
  2. <script>
  3. $(document).ready(function()
  4. {
  5. var $servicevar=$("#serviceA");
  6. $subcategoryvar=$("#subcategoryA");
  7. $options=$subcategoryvar.find('option');
  8. $servicevar.on('change',function()
  9. {
  10. $subcategoryvar.html($options.filter('[value="'+this.value+'"]'));
  11. }).trigger('change');
  12. };

暂无答案!

目前还没有任何答案,快来回答吧!

相关问题