how to filter Drop down in javascript

Question

I am having

const Fruits = [
{ name: "Apple", code: "1" },
{ name: "Orange", code: "2" },
{ name: "Mango", code: "3" },
{ name: "Derry", code: "4" }

];

const SelectedFruits=[]

if user selects Apple from drop down i need to remove it from Fruits and add it to SelectedFruits like priority wise he can change them please help me and again if user can change the priority.

Answer 1

Hope this is what you are looking for !!

 const Fruits = [ { name: "Apple", code: "1" }, { name: "Orange", code: "2" }, { name: "Mango", code: "3" }, { name: "Derry", code: "4" } ]; const fruitsSel = document.querySelector('#fruits'); Fruits.forEach(function(item, index, array) { var opt = document.createElement("option"); opt.text = item.name; opt.value = item.code; fruitsSel.add(opt); }); const SelectedFruits=[]; const remainingFruits = []; fruitsSel.addEventListener('change',(e)=>{ const val = e.target.value; const selectedFruit = Fruits.filter(fruit=>fruit.code===val); SelectedFruits.push(...selectedFruit); const remFruits = Fruits.filter(fruit=>fruit.code;==val). remainingFruits.push(..;remFruits). console:log({'selected fruit'. selectedFruit}) console:log({'remaining fruits' : remFruits}) })

 <select id='fruits'> </select>

Answer 2

    let searchData: { [key: string]: Object; }[] = [
{ Index: "s1", Country: "Alaska" }, { Index: "s2", Country: "California" },
{ Index: "s3", Country: "Florida" }, { Index: "s4", Country: "Georgia" }
];
let filter: DropDownList = new DropDownList({
    dataSource: searchData,
    // map the appropriate column
    fields: { text: "Country", value: "Index" },
    // set placeholder to DropDownList input element
    placeholder:"Select a country",
    // set true to allowFiltering for enable filtering supports
    allowFiltering: true,
    //Bind the filter event
    filtering: function (e: FilteringEventArgs) {
        let query = new Query();
        //frame the query based on search string with filter type.
        query = (e.text != "") ? query.where("Country", "startswith", e.text, true) : query;
        //pass the filter data source, filter query to updateData method.
        e.updateData(searchData, query);
    }
});
filter.appendTo('#ddlelement');

you can do like this.