I am dealing with multiple inputs, specifically textareas with name attributes and some fields being required. Take a look at the example below:
<textarea name="field1" reqired>1</textarea>
<textarea name="field2">2</textarea>
<textarea name="field3" reqired>3</textarea>
<textarea name="field4">4</textarea>
My goal is to extract the name value and check if the field is required. This is how my code looks like:
let customizationInputName=[];
let customizationInputRequired=[];
let customizationInput = document.querySelectorAll('textarea');
for (i = 0; i < customizationInput.length; i++) {
customizationInputName[customizationInput[i].name] = customizationInput[i].value;
customizationInputRequired[customizationInput[i].required] = customizationInput[i].value;
}
console.log(customizationInputName);
console.log(customizationInputRequired);
After running
console.log(customizationInputName)
, I received the correct results for all 4 fields. However, when checking console.log(customizationInputRequired)
, only the last required field and the last field without required attribute were displayed. Can anyone help me identify the issue in my code?