【问题标题】:django dynamic update forms fields without page refresh没有页面刷新的django动态更新表单字段
【发布时间】:2019-03-28 16:39:51
【问题描述】:

我已经使用带有外键字段的选择字段构建了一些 django 表单。

一切正常,但我想向这个领域询问一些事情。

在我的应用程序中,因为需要习惯于许多用户一起工作,所以我需要这个字段(选择字段)是动态的,并且在没有用户刷新页面的情况下更新选择值以查看最后的表格更新。

是否可以在不刷新页面的情况下从此选择字段表单或外键表单字段更新值?

forms.py

class myForm(forms.ModelForm):
    field_2= forms.ModelChoiceField(queryset=mymodel_2.objects.all(),label="ΔΙΕΥΘΥΝΣΗ")
    class Meta:
        model = Mymodel
        fields = ('field_1', 'field_2', 'field_fk')

models.py

class Mymodel(models.Model):
    field_1 = models.CharField(max_length=100, blank=True, null=True)
    field_2 = models.CharField(max_length=254, choices=EIDOS_PROSWPOU_CHOICES, blank=True)
    eidos = models.CharField(max_length=254,choices=EIDOS_PELATHS_CHOICES,blank=True, null=True)
    field_fk= models.ForeignKey('category', blank=True, null=True)


class category(models.Model):
    title = models.CharField(max_length=100, blank=True, null=True)

class mymodel_2(models.Model):
    task = models.CharField(max_length=100, blank=True, null=True)

html:

<form enctype="multipart/form-data" method="post" action="">{% csrf_token %}
{{ form.as_p }}
<input  type="submit"/>

在 html 中:

<div class="row form-group"> <label>field_fk :</label><select name="field_fk" id="field_fk">
  <option value="" selected=""></option>

  <option value="some value 1">some value 1</option>

  <option value="some value 2">some value 2</option>

  <option value="some value 3">some value 3</option>

  <option value="some value 4">some value 4</option>

</select></div>

【问题讨论】:

  • 你需要一个前端 JS 框架来做到这一点。最受欢迎的是ReactAngular
  • @Scratch'N'Purr 举个例子?
  • 您需要将“一些值 1,2,3”等动态更新到您的后端吗?这就是你想要的,对吧?
  • @indexOutOfBounds 不我需要在前端更新我的表单值而不刷新页面
  • 这是example

标签: python html django django-forms


【解决方案1】:

只使用 Django?没有。

您需要让 JavaScript 参与其中。一些 cmets 提到了 React 甚至 Angular,这些都是非常好的 js 框架,但是使用其中任何一个都会让你的问题变得过度。

这就是 JQuery 的亮点。

所以这是许多解决方案之一的简单指南:

  1. 编写一个 Django 视图,返回您想要显示的所需选项。
  2. 使用 JQuery 并编写 get request 以获得这些选择。
  3. 再次使用 JQuery 并相应地修改 DOM。

这只是一种方法。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2021-03-20
    • 2019-03-14
    • 1970-01-01
    • 2012-03-14
    • 1970-01-01
    • 2013-12-03
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多