Question

我有一个模板，用于绘制与图像相关的一些图像和注释。

我想允许用户为直接在模板中显示的一个图像添加注释。然后，当用户填写其评论时，我希望除文本之外的所有其他字段都自动填充。

问题：如何使用Javascript定义表单字段的值？

白痴例子：{{ form.field1.value }} = jsArray[0]

附加示例：

HTML

<button onclick="setImage()">Fill image value</button>

<form method="post" novalidate>
    {% csrf_token %}
    <input type="text" name="image" id="id_image" value="" maxlength="30" readonly>
    <input type="hidden" name="user" id="id_user" {% if form.user.value != None %}value="{{ form.user.value|stringformat:'s' }}"{% endif %} maxlength="30" readonly>
    {{ form.text }}
    <button type="submit">Submit</button>
</form>

JS

  function setImage() {
      document.getElementById("id_image").value = imageObjectTable[0];
      //imageObjectTable[0] is one object of the model "ImageModel"
  }

Django - models.py

    class ImageModel(models.Model):
# Create your models here.
    user = models.ForeignKey(UserModel, on_delete=models.CASCADE, null=True)
    image = models.ImageField(('image'),
                              max_length=IMAGE_FIELD_MAX_LENGTH,
                              upload_to='.')
    date_taken = models.DateTimeField(('date taken'),
                                      null=True,
                                      blank=True,
                                      help_text=('Date image was taken; is obtained from the image EXIF data.'))


class Comment(models.Model):
    image = models.ForeignKey(ImageModel, related_name='comments', on_delete=models.CASCADE)
    user = models.ForeignKey(UserModel, on_delete=models.CASCADE, null=True)
    text = models.TextField()
    created_date = models.DateTimeField(default=timezone.now)
    approved_comment = models.BooleanField(default=False)

Django - Forms.py

class CommentForm(forms.ModelForm):

    class Meta:
        model = Comment
        fields = ('user','image', 'text', )

=＆GT;当我启动JS函数setImage时，HTML中的值很好，但是当我提交表单时，它不起作用：（

非常感谢你的帮助:)。

Answer 1

我假设是因为你想在表单提交后填写后端需要的Django变量吗？

在这种情况下，通常情况下，您需要使用Javascript填写HTML表单字段值，并让表单提交处理其余部分。

您可以使用{{ form.field1.auto_id }}

获取字段的ID（假设您没有手动构建HTML）

然后使用ID通过id选择文档或使用js DOM查询选择器预填充所需的值。

Answer 2

我找到了解决方法...：django形式中期望的值既不是字符串，也不是相关对象，而是与选择位置相关的整数（从1开始，因为0是未定义的选择）。 / p>

所以我的第一个代码是：

 document.getElementById("id_image").value = imageObjectTable[0];

有效的版本是：

 document.getElementById("id_image").value = 1;

感谢您的帮助！

Django：使用javascript数组填充表单字段

2 个答案: