Question

我正在尝试将jQuery Steps Wizard插件与Django表单一起使用，以创建表单向导。

到目前为止，我可以显示表单，可以按以下步骤操作，但是当我按完成按钮时，我收到了POST请求，但它只是重新加载了页面，没有显示错误，什么也没有保存到数据库中。

我在这里做错了什么？我对jQuery没有那么了解。

我认为我浏览了与我的问题有关的所有帖子，到目前为止没有任何进展。

#views.py
def add_bedroom(request, pk):
    get_property_id = pk
    data = {'property':get_property_id}
    property_reference = Property.objects.get(pk=get_property_id)
    if request.method == 'POST':

        bedroom_form = AddBedroomForm(request.POST, request.FILES, initial=data)
        lighting_form = LightingBedroomAddForm(request.POST)
        print('teste')
        if bedroom_form.is_valid() and lighting_form.is_valid():
            bedroom = bedroom_form.save()
            print('error')
            add_lighting = lighting_form.save(commit=False)
            add_lighting.bedroom = bedroom
            add_lighting.save()

            print('Sucesso')
            return HttpResponseRedirect(reverse('properties:property_detail', args=[pk]))
    else:
        bedroom_form = AddBedroomForm(initial=data)
        lighting_form = LightingBedroomAddForm()

    context = {
        'add_bedroom_form':bedroom_form,
        'add_lighting_form':lighting_form,
        'title':"Add Bedroom",
        'reference':property_reference,
    }
    return render(request, 'properties/add-bedroom1.html', context)

#steps.js
var form = $(".validation-wizard").show();

$(".validation-wizard").steps({
    headerTag: "h6"
    , bodyTag: "section"
    , transitionEffect: "fade"
    , titleTemplate: '<span class="step">#index#</span> #title#'
    , labels: {
        finish: "Submit"
    }
    , onStepChanging: function (event, currentIndex, newIndex) {
      // Always allow going backward even if the current step contains invalid fields!
       if (currentIndex > newIndex)
       {
           return true;
       }

       // Forbid suppressing "Warning" step if the user is to young
       if (newIndex === 3 && Number($("#age").val()) < 18)
       {
           return false;
       }

       var form = $(this);

       // Clean up if user went backward before
       if (currentIndex < newIndex)
       {
           // To remove error styles
           $(".body:eq(" + newIndex + ") label.error", form).remove();
           $(".body:eq(" + newIndex + ") .error", form).removeClass("error");
       }

       // Disable validation on fields that are disabled or hidden.
       form.validate().settings.ignore = ":disabled,:hidden";

       // Start validation; Prevent going forward if false
       return form.valid();


    }
    , onFinishing: function (event, currentIndex) {
        var form = $(this);
        return form.validate().settings.ignore = ":disabled", form.valid()
    }
    , onFinished: function (event, currentIndex) {
      alert("Finish button was clicked");
        form.submit();
    }
}), $(".validation-wizard").validate({
    ignore: "input[type=hidden]"
    , errorClass: "text-danger"
    , successClass: "text-success"
    , highlight: function (element, errorClass) {
        $(element).removeClass(errorClass)
    }
    , unhighlight: function (element, errorClass) {
        $(element).removeClass(errorClass)
    }
    , errorPlacement: function (error, element) {
        error.insertAfter(element)
    }
    , rules: {
        email: {
            email: !0
        }
    }
})

我的表单如下：

您可能会建议我使用Django Form Wizard，但是我花了太多时间，但是我走得并不远。

带有Django的jQuery步骤向导未将数据保存到数据库

0 个答案: