building unique list of select options from array in javascript?

Question

I wrote this script,

<script>

const http = new XMLHttpRequest()
url = "http://192.168.0.2/hotspots";
window.onload = function(){
    var request = new XMLHttpRequest();

    request.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            result = eval(this.responseText)
            select = document.getElementById('access_points_select');
            for (var i = 0; i<=result.length; i++){
                var opt = document.createElement('option');
                opt.value = result[i];
                opt.innerHTML = result[i];
                select.appendChild(opt);
            }
        }
};

request.open('GET', url);
request.send();
}

</script>
</head>
<body>
<select name="access_points" id="access_points_select">
</select>

but because resource also returns duplicates i want to avoid duplicate entries into the select dropdown, how can I achieve this without creating unique array without creating another array then result.

Why "without creating another array" as a constraint, given how simple it would be if you could? — jonrsharpe, May 29 '20 at 18:20
i was hoping if there is a way to query select options items thats why i said without other than `result` — Ciasto piekarz, May 29 '20 at 18:22
you could add `if( i !== result.indexOf(result[i]) ) continue;` to the beginning of your for loop. Fairly common technique, [see here](https://stackoverflow.com/questions/1960473/get-all-unique-values-in-a-javascript-array-remove-duplicates) — David784, May 29 '20 at 18:28

Will Jenkins · Accepted Answer · 2020-05-29T18:31:10.067

0

If eval(this.responseText) returns an array you can use a Set to ensure there are no duplicates.

If you need to filter undefined you can do chain that on the end too:

 result = [...new Set(this.responseText)].filter(Boolean)

edited May 29 '20 at 18:31

answered May 29 '20 at 18:27

Will Jenkins

9,507
1
27
46

strangely i am getting an extra option with value undefined :( – Ciasto piekarz May 29 '20 at 18:29
that is messing up the output to each character as option in select. – Ciasto piekarz May 29 '20 at 18:33
what does responseText look like? – Will Jenkins May 29 '20 at 18:35
`[,t,h,i,s, ,a, ,w,o,r,d,] ` instead of 3 items I am getting 13 items in dropdown, i used `eval(this.responseText)` though which you forgot but that still gave `undefined` – Ciasto piekarz May 29 '20 at 18:36

building unique list of select options from array in javascript?

1 Answers1