在django上提交一个有错误的表单后保留字段数据

nnvyjq4y  于 2023-02-05  发布在  Go
关注(0)|答案(3)|浏览(146)

在我提交了一个django出错的表单后,表单的所有字段都被清理了,我想保留字段上的信息,因为这会在用户提交数据时有所帮助。
这是我的views.py的应用程序:

def new(request):
    context = {}
    if request.method == 'POST':
        form = NewSubject(request.POST)
        if form.is_valid():
            context['is_valid'] = True
            form.save()
            form = NewSubject()
        else:
            context['is_valid'] = False
    else:
        form = NewSubject()

    context['form'] = form
    return render(request, 'subjects/new.html', context)
798qvoo8

798qvoo81#

我建议你使用 AJAX 。因为在这方面,我们可以写不同的情况下处理提交是否成功。如果成功输入。瓦尔('')否则显示错误和不干净的输入字段。

$('#post-form').on('submit', function(event){
event.preventDefault();
console.log("form submitted!")  // sanity check
create_post();)};   function create_post() {
console.log("create post is working!")
$.ajax({
    url : "/lrequestConfirmed/", // the endpoint
    type : "POST", // http method
    data : {
      datef: $('#datepicker').val(),
      type: $('#type').val(),
      reason: $('#reason').val()

    }, // data sent with the post request

    // handle a successful response
    success : function(json) {
        $('#datepicker').val(''); // remove the value from the input
        $('#reason').val(''); 
        $('#results').html("<div class='alert alert-success alert-dismissable'><a href='#'' class='close' data-dismiss='alert' aria-label='close'>×</a><strong>Success!</strong> Your request has been recored</div>");
        console.log(json); // log the returned json to the console
        console.log("success"); // another sanity check
    },

    // handle a non-successful response
    error : function(xhr,errmsg,err) {
        $('#results').html("<div class='alert alert-danger alert-dismissable'><a href='#'' class='close' data-dismiss='alert' aria-label='close'>×</a><strong>Oops!</strong> Something went wrong</div>"); // add the error to the dom
        console.log(xhr.status + ": " + xhr.responseText); // provide a bit more info about the error to the console
    }
});
gwbalxhn

gwbalxhn2#

就像Bear Brown说的,数据在出错后会保留在字段中,但我没有使用Django的纯表单,我需要做一些调整。我用原始Django表单创建了一个隐藏的div,并使用JavaScript传递字段中的数据。下面是我如何操作的一个示例:
原始Django表单的id基于表单上的字段名,所以,如果你在www.example.com上定义字段forms.py为“name”,那么字段的id就是“id_name”:

function error(){ document.getElementById('name').value = document.getElementById('id_name').value;}

这就是表单上的字段是如何被调用的。在它被呈现之后,它将包含表单字段的数据并有一个id,所以我通过id(“id_name”)获得元素并为我的个性化字段传输信息。

<div style="display: none;">
   {{ form.name }}
</div>

这是带有我的样式的字段,用户将在其中编辑数据并进行自己的修改。

<input id="name" class="form-control" type="text" maxlength="100" name="name" placeholder="Ex.: Metemática" onchange="slugDefine()" onkeyup="slugDefine()" /><br>

谢谢你的帮助!

33qvvth1

33qvvth13#

如果您不想使用Javascript,可以在HTML模板中使用value关键字。但是,当表单无效时,请确保在else语句中包含return语句。

def new(request):
    context = {}
    if request.method == 'POST':
        form = NewSubject(request.POST)
        if form.is_valid():
            context['is_valid'] = True
            form.save()
            form = NewSubject()
        else:
            context['is_valid'] = False
            return render(request, 'subjects/new.html', context)
    else:
        form = NewSubject()

    context['form'] = form
    return render(request, 'subjects/new.html', context)

然后,在HTML模板中,可以将value="{{ form.billing_email.value }}"添加到div标记中。

<div class="">
      <label for="billing_email" class="">
             Billing contact email:
      </label>
       <input
          type="email"
           class=""
           name="billing_email"
           id="billing_email"
           placeholder="Text"
           value="{{ form.billing_email.value }}"      
            />
           {% for error in form.billing_email.errors %}
                <div class="">{{ error }}</div>
            {% endfor %}
     </div>

相关问题