This is my last resort,
I am trying to retrieve address data from a database, It has been retrieved using Ajax. I'm retrieving a value (number from 0-3) which I then need to preselect the value from the options. This happens multiple times as there is multiple addresses (as shown by a for loop)
For some unknown reason only the last Select is being selected (all others have not regular)
name = response.address_details[i].address_code;
$("[name="+ name +"]").find("option[value='2']").prop('selected',true);
Above is the code within the for loop that should get the current address code and select the option (static value=2 just for testing). Name retrieves each address code as the for loop continues
I have tried changing it to update based on class, and they all update, although when I try to match it with the name of the option (ie option name=183) it doesn't work.
Full code below:
var table = document.getElementById('addressList')
for (var i = 0; i < response.address_details.length; i++){
var row = `
<tr id="${response.address_details[i].address_code}">
<td>${response.address_details[i].address}</td>
<td>${response.address_details[i].address_code}</td>
<td>${response.address_details[i].frequency}</td>
<td>
<select name="${response.address_details[i].address_code}" class="address_code" id="183">
<option value="0">Not regular</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
</td>
</tr>`
table.innerHTML += row
name = response.address_details[i].address_code;
$("[name="+ name +"]").find("option[value='2']").prop('selected',true);
}
I have also tested using id instead of name and making the id variable, although it seems to be an issue with how this particular loop works and I cant seem to see the issue.
In practice we should see each option be selected on 2 without using the class, and by identifying it using the unique name value response.address_details[i].address_code