How can I stop my javascript dropdown from displaying blank box instead of selected value after selection?

Question

I am pulling from a list on Sharepoint, When selected it refreshes the page whilst only showing rows in a table below with certain values.

 getData();

var filterType = 0;
var filterValue = "";

var displaySet = 1;

var param = (location.search.split('a=')[1]||'').split('&')[0];
var param2 = (location.search.split('b=')[1]||'').split('&')[0];
var param3 = (location.search.split('c=')[1]||'').split('&')[0];
param3 = decodeURI(param3);

//console.log(param);
//console.log(param2);
//console.log(decodeURI(param3));

if(param != "")
{
    displaySet = Number(param);
}

if(param2 != "")
{
    filterType = param2;
    //console.log("p2 " + param2);
}

if(param3 != "")
{
    filterValue = param3;
    //console.log("p3 " + param3);
}


    function pagination(ideas)
    {
        var paginationedIdeas = [];
        paginationedIdeas = ideas;

            paginationedIdeas.sort(function(a, b) {
                a = new Date(a.dateModified);
                b = new Date(b.dateModified);
                return a>b ? -1 : a<b ? 1 : 0;
            });     

        paginationedIdeas.reverse();

        var pIset1 = [];
        var pIset2 = [];
        var pIset3 = [];

        for(var c =0; c<paginationedIdeas.length; c++)
        {
            if( c < 12)
            {
                pIset1.push(paginationedIdeas[c]);
            }
            else if(c<24)
            {
                pIset2.push(paginationedIdeas[c]);
            }
            else if(c >= 24)
            {
                pIset3.push(paginationedIdeas[c]);
            }


        }

What changes do I need to make to my javascipt so it stops displaying blank after selecting an option? Thanks

ASP:

Filter:

<p>Architect: <select id="filterArchitect"><option ></option></select>
Idea Owner: <select id="filterIdeaOwner"><option ></option></select>
Business Analyst: <select id="filterBusinessAnalyst"><option ></option></select>
<input type="button" id="allbtn" value="All" onclick="location.href='https://....aspx'"/></p>

Answer 1

Assuming your code like this:

<select>
<option></option> <!-- blank one -->
<option value="1">......</option>
<option value="2">......</option>
<option value="3">......</option>
....
</select>

Do this scripting:

<script>
var select = document.getElementsByTagName('select')[0]
select.change = function() {
var elem = select.document.getElementsByTagName('option')[0];
if(elem.innerText == "") {   // That means its blank element
elem.parentNode.removeChild(elem);
}
}
</script>

This is a simpler version, you can modify it according to your need.