Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Filter duplicate options from select dropdown

I have a dropdown selector generated from a list and want to filter the options to remove the duplicate entries. e.g. I want to filter ...

<select name="company">
    <option "1">Microsoft</option>
    <option "2">Microsoft</option>
    <option "3">Microsoft</option>
    <option "4">Microsoft</option>
    <option "5">Apple</option>
    <option "6">Apple</option>
    <option "7">Google</option>
</select>

... down to present the user with something like...

<select name="company">
    <option "1">Microsoft</option>
    <option "5">Apple</option>
    <option "7">Google</option>
</select>

(The data comes from a Sharepoint Lookup on another list and I'm thinking I can use jquery to keep only the unique options without having to go into the guts of what's going on.) Can I remove options like this? Thanks.

like image 851
afewscoops Avatar asked Dec 09 '09 17:12

afewscoops


People also ask

How do I remove duplicate options from select?

Remove duplicate values Select the range of cells that has duplicate values you want to remove. Tip: Remove any outlines or subtotals from your data before trying to remove duplicates. Click Data > Remove Duplicates, and then Under Columns, check or uncheck the columns where you want to remove the duplicates.

How do I prevent duplicates in Dropdownlist?

You also can remove the duplicates from the table list firstly, then create the drop down list. Select the column range you want to use in the table, the press Ctrl + C to copy it, and place it to another position by pressing Ctrl + V. Then keep selecting the list, click Data > Remove Duplicates.

How can we prevent duplicate values in multiple dropdowns in jquery?

The below codes works fine for two dropdowns, but not for more than 2. var $select = $("select[id$='go']"); $select. change(function() { $select . not(this) .


3 Answers

You can do it with a simple loop - there may be a cleverer way to handle this with jQuery selectors that I'm not seeing, though. The following should work:

var usedNames = {};
$("select[name='company'] > option").each(function () {
    if(usedNames[this.text]) {
        $(this).remove();
    } else {
        usedNames[this.text] = this.value;
    }
});

Edit: Here's a functional-style one-liner that does it with the help of the excellent Underscore.js, although the previous version is almost certainly more efficient:

_.each(_.uniq(_.pluck($("select[name='company'] > option").get(), 'text')), function(name) { $("select[name='company'] > option:contains(" + name + ")").not(":first").remove(); });
like image 74
Greg Campbell Avatar answered Nov 15 '22 20:11

Greg Campbell


You can do something like this:

var previousOption;
$('select[name=company] option').each(function() {
    if (this.text == previousOption) $(this).remove();
    previousOption= this.text;
});
like image 33
Justin Swartsel Avatar answered Nov 15 '22 19:11

Justin Swartsel


You can try the following code, it will remove the duplicates regardless of their position. Here #targetSelect is your target Dropdown

var a = new Array();
$(#targetSelect).children("option").each(function(x){
test = false;
b = a[x] = $(this).text();
for (i=0;i<a.length-1;i++){
if (b ==a[i]) test =true;
}
if (test) $(this).remove();
}); 
like image 44
Namwar Rizvi Avatar answered Nov 15 '22 18:11

Namwar Rizvi