How can I loop through common fieldsets in a single form in thymeleaf/html

Amarthya reddy 0
Viewed 38

I have a form which contains multiple virtual fieldsets that user can add as many as needed.

I'm trying to disable the fieldset based on a condition. Currently I'm disabling the fieldset using Jquery. The following is the code in js

if(condition){
$(#fieldset_id).prop("disabled",true);
}

With the above code, only the first fieldset is being disabled. The following fieldsets which are being added by the user are not being disabled. Is there any way i can iterate through the fieldsets using thymeleaf/jquery

Following is my html

<fieldset id="fieldset_id">
<div>
<label class=""> Field 1</label>
<div class="">
  <input type="text" class=""
        th:field="*{array[__${Stat.index}__].name}"
</div>
</div>

<div>
<label class=""> Field 2</label>
<div class="">
  <input type="text" class=""
        th:field="*{array[__${Stat.index}__].id}"
</div>
</div>

<div>
<label class=""> Field 3</label>
<div class="">
  <input type="text" class=""
        th:field="*{array[__${Stat.index}__].email}"
</div>
</div>

<div>
<label class=""> Field 4</label>
<div class="">
  <input type="text" class=""
        th:field="*{array[__${Stat.index}__].address}"
</div>
</div>

</fieldset>

The above code is common for multiple fieldsets that the user selects.

thymeleaf jquery javascript html
1 Answers

the selector $('#fieldset_id') will only ever select the first element with that ID because IDs are supposed to be unique. You can instead add a common class shared by each fieldset and select that, for example $('.fieldset_class'). if you modify your script like so:

if(condition){ 
    $('.fieldset_class').prop("disabled",true);
}

then all elements with the class fieldset_class should be disabled

usercvMy0
Related