Dados do select ficam fora da caixa de seleção

Bom dia fiz um select para escolha de serviços, tenho que pegar esse serviço selecionado e passar para outra jsp, mostrando qual foi escolhido, para isso eu estou usando um input :

< input type="hidden" name="idservico" value="<%=serv.getIdservico() %>"/>

Entretanto os campos disponíveis para serem selecionados(serviços) saem da caixa de seleção, quando retiro esse input eles voltam:

Selecione o Serviço Desejado: 
            <select name="servico_idservico" size="1" required>
                <option value="">Selecione ...</option>
                <% for(Servico serv:lista2){ %>
                <option value="<%=serv.getIdservico() %>"><%=serv.getNome() %></option>
                  
            <input type="hidden" name="idservico" value="<%=serv.getIdservico() %>"/> 
             <%  } %>
             </select>

Você não pode usar um <input> dentro de um <select>.

Para isso, crie uma função em javascript e chame ela no evento onChange do seu <select>, por exemplo:

<script>
    function setaIdServiço(id){
        document.getElementById("idservico").value = id;
    }
</script>

Coloque o seu <input> fora do <select>, e faça o seguinte:

<select name="servico_idservico" size="1" onChange="setaIdServiço(this.value);" required>
    <option value="">Selecione ...</option>
    <% for(Servico serv:lista2){ %>
        <option value="<%=serv.getIdservico() %>"><%=serv.getNome() %></option>
    <%  } %>
</select>

<input type="hidden" name="idservico" value=""/> 

Espero ter ajudado.