Hi all, hope you are doing well.
I have a problem with my forms (I fixed it) by an idea I’ll mention here, But I think I miss something or Django Forms have a solution for it.
I have one page URL (many tabs and as a result many forms and many many inputs also).
All forms must save by one save button under one form <form class="add-product"></form>
this form has many tabs
The next image illustrate what I mean.
- My Problem
Inadd-product-form
everything is OK(Saving process has done perfectly till now) but inedit-product-form
I noticed that (Any inputs present in a tab I don’t enter, every input in this tab return None and the update process ofedit-product-form
leads to make the original data that I have saved inadd-product-form
return to None or to default - Asclean_field(self)
method stated-)
- My Idea That Fix The Problem Till Now
The idea that came in my mind to fix this issue is to make (hidden inputs take “0” value and when user hit or enter the tab like pricing Tab thepriceTab
variable changed to “1” ).
Then after I’ve saved the form or have got any inputs values from this tab,
I’ve made a simple check if the variable of this tab is 0 or 1 (if it is 0 I skip saving process -fields of that tab didn’t changed -, if it is 1 then saving process will take place).
I know that Django forms has (form.has_changed() and form.changed_data())
But It always return with (True) even if no data changed (I activate them in another Forms that have low number of inputs and tabs) because debugging here (is very hurt and take many times) also to keep everything works as expected (I will return again to fit Django Form rules) but after I’ve finished primary step of my project.
These are all tabs of edit-product-form
<form method="post" enctype="multipart/form-data" class="edit-product-form" id="edit-product-form"> <!--novalidate-->
{% csrf_token %}
{% include 'products/includes/buttons/div_buttons.html' %}
<fieldset :disabled="!isEdit">
<section class="content">
<div class="container-fluid">
<div class="row">
<input type="hidden" name="hide-category" :value="categoryTab">
<input type="hidden" name="hide-price" :value="priceTab">
<input type="hidden" name="hide-image" :value="imageTab">
<input type="hidden" name="hide-settings" :value="settingsTab">
<!-- Starting our template tab scenario -->
<div class="col-md-12">
<div class="card">
<!-- Buttons -->
{% include 'products/includes/buttons/tabs_buttons.html' %}
<div class="card-body">
<div class="tab-content">
price=[[priceTab]]- settings=[[settingsTab]]- category=[[categoryTab]]- image=[[imageTab]]
<!-- Product Tab -->
<div class="active tab-pane fade show clearfix" id="product-tab" role="tabpanel" aria-labelledby="product-tab">
{% include 'products/includes/edit_product/edit_product.html' %}
</div>
<!-- /.tab-pane -->
<!-- Category Tab -->
<div class="tab-pane fade show clearfix" id="category-tab" v-if="hideCategory" role="tabpanel" aria-labelledby="category-tab">
{% include 'products/includes/category/add_category.html' %}
</div>
<!-- /.tab-pane -->
<!-- Unit TAb -->
<div class="tab-pane fade show clearfix" id="unit-tab" v-if="hideUnit" role="tabpanel" aria-labelledby="unit-tab">
{% include 'products/includes/units/edit_uom.html' %}
</div>
<!-- /.tab-pane -->
<!-- Adding UOM Sales Tab -->
<div class="tab-pane fade show clearfix" id="unit-sale-tab" v-if="hideUnitSale"
role="tabpanel" aria-labelledby="unit-sale-tab">
{% include 'products/includes/unit_sale/edit_uom_sale.html' %}
</div>
<!-- /.tab-pane -->
<!-- Adding UOM Purchase Tab -->
<div class="tab-pane fade show clearfix" id="unit-purchase-tab" v-if="hideUnitPurchase"
role="tabpanel" aria-labelledby="unit-purchase-tab">
{% include 'products/includes/unit_purchase/edit_uom_purchase.html' %}
</div>
<!-- /.tab-pane -->
<!-- Price Tab -->
<div class="tab-pane fade show clearfix" id="price-tab" v-if="hidePrice" role="tabpanel" aria-labelledby="price-tab">
{% include 'products/includes/price/add_price.html' %}
</div>
<!-- /.tab-pane -->
<!-- Image Tab -->
<div class="tab-pane fade show clearfix" id="image-tab" v-if="hideImage" role="tabpanel" aria-labelledby="image-tab">
{% include 'products/includes/images/add_images.html' %}
</div>
<!-- /.tab-pane -->
<!-- Settings Tab -->
<div class="tab-pane fade show clearfix" id="settings-tab" v-if="hideSettings" role="tabpanel" aria-labelledby="settings-tab">
{% include 'products/includes/settings/add_settings.html' %}
</div>
<!-- /.tab-pane -->
<!-- Vendors Tab -->
<div class="tab-pane fade show clearfix" id="vendors-tab" v-if="hideVendors" role="tabpanel" aria-labelledby="vendors-tab">
{% include 'products/includes/vendors/add_vendors.html' %}
</div>
<!-- /.tab-pane -->
<!-- Manufacture Tab -->
<div class="tab-pane fade show clearfix" id="manufacture-tab" v-if="hideManufacture" role="tabpanel" aria-labelledby="manufacture-tab">
{% include 'products/includes/manufacture/add_manufacture.html' %}
</div>
<!-- /.tab-pane -->
<!-- Substitution Tab -->
<div class="tab-pane fade show clearfix" id="substitution-tab" v-if="hideSubstitution" role="tabpanel" aria-labelledby="substitution-tab">
{% include 'products/includes/substitution/add_substitution.html' %}
</div>
<!-- /.tab-pane -->
</div>
<!-- /.tab-content -->
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!-- /.col -->
</div>
</div>
</section>
</fieldset>
</form>
<!-- /.form -->
This is part of my views.py
if request.POST.get('hide-settings') == '1': #? it comes as string from post
if settings_form.is_valid():
print('Product settings Form is valid')
save_settings_form = settings_form.save()
save_settings_form.save()
Is my idea true to overcome this issue ?
Any suggestion or ideas