Django动态表单集不适用于第一个POST

时间:2019-02-04 21:43:31

标签: jquery django-forms django-templates formset

我正在尝试使用表单集在Django上动态创建表单字段。现在,如果我使用form.as_p来发布值(即使具有多个表单),则表单集会将值保存在数据库中。但是在使用自定义字段时,即使我已经填写了表格,该表格也会重新加载,说明其无效或必填字段。但是,如果我将这些值写入第二种形式(一旦重新加载),则这些值会保存下来。一旦发布,我会尽力寻找答案,但没有一个起作用。

javascript
$(document).ready(function() {
  // Code adapted from http://djangosnippets.org/snippets/1389/
  function updateElementIndex(el, prefix, ndx) {
    var id_regex = new RegExp('(' + prefix + '-\\d+-)');
    var replacement = prefix + '-' + ndx + '-';
    if ($(el).attr("for")) $(el).attr("for", $(el).attr("for").replace(id_regex,
 replacement));
    if (el.id) el.id = el.id.replace(id_regex, replacement);
    if (el.name) el.name = el.name.replace(id_regex, replacement);
  }
  function deleteForm(btn, prefix) {
    var formCount = parseInt($('#id_' + prefix + '-TOTAL_FORMS').val());
    if (formCount > 1) {
      // Delete the item/form
      $(btn).parents('.item').remove();
      var forms = $('.item'); // Get all the forms
      // Update the total number of forms (1 less than before)
      $('#id_' + prefix + '-TOTAL_FORMS').val(forms.length);
      var i = 0;
      // Go through the forms and set their indices, names and IDs
      for (formCount = forms.length; i < formCount; i++) {
        $(forms.get(i)).children().children().each(function() {
          updateElementIndex(this, prefix, i);
        });
      }
    } // End if
    else {
        alert("You have to enter at least one todo item!");
    }
    return false;
  }
  function addForm(btn, prefix) {
    var formCount = parseInt($('#id_' + prefix + '-TOTAL_FORMS').val());
    // You can only submit a maximum of 10 todo items
    if (formCount < 10) {
      // Clone a form (without event handlers) from the first form
      var row = $(".item:first").clone(false).get(0);
      // Insert it after the last form
      $(row).removeAttr('id').hide().insertAfter(".item:last").slideDown(300);

      // Remove the bits we don't want in the new row/form
      // e.g. error messages
      $(".errorlist", row).remove();
      $(row).children().removeClass('error');

      // Relabel/rename all the relevant bits
      $(row).children().children().each(function() {
        updateElementIndex(this, prefix, formCount);
        if ( $(this).attr('type') == 'text' )
          $(this).val('');
      });

      // Add an event handler for the delete item/form link
      $(row).find('.delete').click(function() {
        return deleteForm(this, prefix);
      });
      // Update the total form count
      $('#id_' + prefix + '-TOTAL_FORMS').val(formCount + 1);
    } // End if
    else {
      alert("Sorry, you can only enter a maximum of ten items.");
    }
    return false;
  }
  // Register the click event handlers
  $("#add").click(function() {
    return addForm(this, 'form');
  });

  $(".delete").click(function() {
    return deleteForm(this, 'form');
  });
});
html
{{ordercart_form.management_form}}   <!--formset order cart form-->
        {% for order in ordercart_form.forms %}
        <div class="item">


        <table class="order_table_class add_order_form">         <!--add_order_form to modify height-->

            <tr>
                <td>{{order.as_p}}<td>

                <th><label class="form_label">{{ order.width.label }}</label> </th>
                <th><label class="form_label">{{ order.height.label }}</label> </th>
                <th><label class="form_label">{{ order.quantity.label }}</label> </th>
                <th><label class="form_label">{{ order.frame.label}}</label> </th>
                <th><label class="form_label">{{ order.roomtype.label}}</label> </th>
                <th><label class="form_label">{{ order.price.label}}</label> </th>
            </tr>
        </table>


        <table class="order_table_class add_order_form">         <!--add_order_form to modify height-->

            <tr>

                <td>{{order.width | add_class:"form_fields_table" |attr:"placeholder:ft"|attr:"min:0"}}</td>
                <td>{{order.height | add_class:"form_fields_table"|attr:"placeholder:ft"|attr:"min:0"}}</td>
                <td>{{order.quantity | add_class:"form_fields_table" |attr:"placeholder:no. items"|attr:"min:0"}}</td>
                <td>{{order.frame | add_class:"form_fields_table"}}</td>
                <td>{{order.roomtype | add_class:"form_fields_table"}}</td>
                <td>{{order.price | add_class:"form_fields_table" |attr:"placeholder:2000.00"|attr:"min:0"}}</td>
                <td><a class="delete" href="#">Delete</a></td>
            </tr>
                    </table>
            </div>
            {%endfor%}
                    <p><a id="add" href="#">Add another item</a></p>

        <input class="submit_button" value=" Submit" type="submit">

0 个答案:

没有答案