Save value from a select and display

Question

I’m developing a CRUD of a web system. In the employee registration I use two select elements to display the options, when registering work all ok, the information goes to the bank. The problem is to click edit and bring this information from select, select the edit screen comes with the initial value of select; example: in the register I put that I am support, when editing the field select this administrator and not the correct, support. Can anyone help me bring the correct information of these selects.

Registration screen where put the options SUPERVISOR AND SUPPORT

On the edit screen, the fields appear as administrator.

My form of employees

<div class="row">
<form action="@{funcionarios.salvarFuncionarios}" method="post">
    <div class="col-lg-6">
        <input type="hidden" name="funcionario.id" value="${f?.id}" />
        <div class="form-group">
            <label>Nome completo:</label> <input type="text"
                name="funcionario.nome" class="form-control"
                value="${flash['funcionario.nome'] ? flash['funcionario.nome'] : f?.nome}">
            <span class="alert-danger">#{error 'funcionario.nome' /}</span>
        </div>

        <div class="form-group">
            <label>Email:</label> <input type="text" name="funcionario.email"
                class="form-control"
                value="${flash['funcionario.email'] ? flash['funcionario.email'] : f?.email}">
            <span class="alert-danger">#{error 'funcionario.email' /}</span>
        </div>

        <div class="form-group">
            <label>Função:</label> <select name="funcionario.funcao"
                class="form-control"
                value="${flash['funcionario.funcao'] ? flash['funcionario.funcao'] : f?.funcao}">
                <option>Administrador</option>
                <option>Suporte</option>
                <option>Supervisor</option>
            </select> <span class="alert-danger">#{error 'funcionario.funcao' /}</span>
        </div>

        <div class="form-group">
            <label>Nível de acesso:</label> <select
                name="funcionario.nivelAcesso" class="form-control"
                value="${flash['funcionario.nivelAcesso'] ? flash['funcionario.nivelAcesso'] : f?.nivelAcesso}">
                <option>Administrador</option>
                <option>Suporte</option>
            </select> <span class="alert-danger">#{error 'funcionario.nivelAcesso'
                /}</span>
        </div>
    </div>
    <div class="col-lg-6">
    #{if f}
        <div class="form-group">
            <label>Nome de usuário:</label> <input id="loginUsuario" type="text" placeholder="Mínimo 5 caracteres"
                name="funcionario.login" class="form-control" disabled="disabled"
                value="${flash['funcionario.login'] ? flash['funcionario.login'] : f?.login}">
            <span class="alert-danger">#{error 'funcionario.login' /}</span>
        </div>
        #{/if}
        #{ifnot f}
        <div class="form-group">
            <label>Nome de usuário:</label> <input id="loginUsuario" type="text" placeholder="Mínimo 5 caracteres"
                name="funcionario.login" class="form-control"
                value="${flash['funcionario.login'] ? flash['funcionario.login'] : f?.login}">
            <span class="alert-danger">#{error 'funcionario.login' /}</span>
        </div>

        <div class="form-group">
            <label>Senha:</label> <input type="password" placeholder="Mínimo 6 caracteres"
                name="funcionario.senha" class="form-control"
                value="${flash['funcionario.senha'] ? flash['funcionario.senha'] : f?.senha}">
            <span class="alert-danger">#{error 'funcionario.senha' /}</span>
        </div>
        <div class="form-group">
            <label>Confirmar senha:</label> <input type="password" name="senha"
                class="form-control"> <span class="alert-danger">#{error
                'senha' /}</span>
        </div>
        #{/ifnot}
    </div>
    <div class="col-lg-12">
        <button type="submit" class="btn btn-success">Salvar</button>
        <button type="reset" class="btn btn-danger"
            onclick="window.location.href='/funcionarios/listagemFuncionarios';">
            Cancelar</button>
    </div>
</form>

Answer 1

The problem is that you are only listing the data from select, and not define which item will be selected from <option> using the selected, example:

<select>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="vw">VW</option>
  <option value="audi" selected>Audi</option>
</select>

1- I suggest creating a array with [Administrador,Suporte,Supervisor]

2- make a foreach adding each item into one <option>, if the current item is equal to the item flash['funcionario.funcao'] (previously selected value)

Sorry I couldn’t help with the syntax, I hope I’ve helped.