Hello,
Please i have about 7 file upload forms on my website, I would like to put in a condition whereby the next form only appears when the previous form has been clicked.
Right now they all appear at the same time which makes the user experience not as good as i would like.
the forms are
<div class="product-form__input product-form__photo">
<label for="photo">Upload Image Here</label>
<input required class="required" id="photo" type="file" name="properties[photo]">
</div>
<div class="product-form__input product-form__photo">
<label for="photo">Extra Image 1</label>
<input required class="required" id="photo2" type="file" name="properties[photo2]">
</div>
<div class="product-form__input product-form__photo">
<label for="photo">Extra Image 2</label>
<input required class="required" id="photo3" type="file" name="properties[photo3]">
</div>
<div class="product-form__input product-form__photo">
<label for="photo">Extra Image 3</label>
<input required class="required" id="photo4" type="file" name="properties[photo4]">
</div>
<div class="product-form__input product-form__photo">
<label for="photo">Extra Image 4</label>
<input required class="required" id="photo5" type="file" name="properties[photo5]">
</div>
<div class="product-form__input product-form__photo">
<label for="photo">Extra Image 5</label>
<input required class="required" id="photo6" type="file" name="properties[photo6]">
</div>
<div class="product-form__input product-form__photo">
<label for="photo">Extra Image 6</label>
<input required class="required" id="photo7" type="file" name="properties[photo7]">
</div>