Django表单：如何将每个动态输入/行保存到数据库中答案

【问题标题】：Django form: how to save every dynamic inputs / rows into databaseDjango表单：如何将每个动态输入/行保存到数据库中
【发布时间】：2021-09-15 21:25:52
【问题描述】：

我是 Django 的初学者。我正在开发一个项目，其中模型是 FileAccess 并且有一个名为 files_link 的字段。我在 Django 表单中使用 jquery 创建了多个动态输入/添加的行（该字段）。
当我们提交表单时，只有最后一个动态输入被保存到数据库中（使用PostgreSQL数据库保存数据）。

示例：假设输入 1、输入 2、输入 3 如果有值是 link1、link2、link3 并且只有最后一个值link3 已保存到数据库中。但 files_link 的预期输出是所有输入数据 link1、link2、link3

dynamic inputs image of files_link

现在我想将每个输入值/行数据（files_link）保存到数据库中。我需要帮助来解决这个问题。
提前谢谢你。

Django 3.1.7

PostgreSQL

models.py

class FileAccess(models.Model):
    author = models.ForeignKey(User, on_delete=models.CASCADE)
    files_link = models.CharField(max_length=230)
    revoke_access_name = models.TextField(null=True, blank=True) 
    date_posted = models.DateTimeField(auto_now_add=timezone.now)

forms.py

class FileAccessForm(forms.ModelForm):

    class Meta:
        model = FileAccess
        fields = ['files_link', 'revoke_access_name']

fileaccess_form.html

{% extends "blog/basep.html" %}
{% load crispy_forms_tags %}

{% block content %}

    <div class="content-section">
        <form method="POST">
            {% csrf_token %}

            <fieldset class="form-group">
                <legend class="border-bottom mb-4">File Server Access Activation Form</legend>
                <div class="input-wrapper">
                    <div>Files link : <br/>
                        <input type="text" name="files_link[]" value=""/>
                        <a href="javascript:void(0);" class="add-input" title="Add input"><i class="glyphicon glyphicon-plus"></i></a>
                    </div>
                </div>
                {{ form.revoke_access_name|as_crispy_field }}                
            </fieldset>

            <div class="form-group">
                <button class="btn btn-outline-info" type="submit">Submit</button>
            </div>
        </form>
    </div>

<script>
    $(document).ready(function(){
        var max_input_fields = 10;
        var add_input = $('.add-input');
        var input_wrapper = $('.input-wrapper');
        var new_input = '<div><input type="text" name="files_link" value=""/><a href="javascript:void(0);" class="remove-input" title="Remove input"><i class="glyphicon glyphicon-remove"></a></div>';
        var add_input_count = 1;
        $(add_input).click(function(){
            if(add_input_count < max_input_fields){
                $(input_wrapper).append(new_input);
                add_input_count++;
            }
        });
        $(input_wrapper).on('click', '.remove-input', function(e){
            e.preventDefault();
            $(this).parent('div').remove();
            add_input_count--;
        });
    });
</script>


{% endblock content %}

views.py

class FileAccessCreateView(LoginRequiredMixin, CreateView):
    model = FileAccess
    form_class = FileAccessForm

    def form_valid(self, form):
        form.instance.author = self.request.user
        return super().form_valid(form)

【问题讨论】：

标签： jquery django postgresql

【解决方案1】：

我认为你不能用当前的models.py 做到这一点。

files_link = models.CharField(max_length=230)。这仅允许您存储单个值，尽管您在 fileaccess_form.html 中添加了 jquery。

你可以使用这样的东西。

from django.contrib.postgres.fields import JSONField

class FileAccess(models.Model):
    author = models.ForeignKey(User, on_delete=models.CASCADE)
    files_link = JSONField()
    revoke_access_name = models.TextField(null=True, blank=True) 
    date_posted = models.DateTimeField(auto_now_add=timezone.now)

需要修改jquery提供files_link = {'link1':input1,'link2':input2,..}

否则，您将不得不迁移到像 mongoDB 这样的 NoSQL 数据库，它没有像 PostgreSQL、MySQL 等预定义的列。

【讨论】：