How to fill in several input fields with data coming from the database?

Question

I have a little problem in my system, I have already registered several equipment in my system, but each equipment has a list of doors.

---

How do I generate inputs dynamically according to the number of ports registered in the database?

---

Example: equipment X has 5 ports, on this screen is generated dynamically the 5 input fields with the 5 port descriptions coming from the database, so that the user can have the option to edit this information.
As I am doing, it is generating only one field with an array of values.

<input type="hidden" name="patchpanel.id" value="${p?.id}" />
<label>Portas:</label> 
    <input type="text" name="patchpanel.portas.descricao" 
           class="form-control"
           value="${flash['patchpanel.portas.descricao'] 
                    ? flash['patchpanel.portas.descricao'] 
                    : p?.portas.descricao}" />

My model patchpanel

@Entity
public class Patchpanel extends Model {

@Required 
public String nome; 
@Required 
public String mac; 
@Required 
@IPv4Address 
public String ip; 
@Required 
public String numPortas; 

@OneToMany(
    cascade={CascadeType.PERSIST, CascadeType.MERGE}, 
    mappedBy="patchpanel") 
public List<Porta> portas; 

@ManyToOne 
@JoinColumn(name="torre_id") 
public Torre torre; 

@Enumerated(EnumType.STRING) 
public Status status; 

My model doors:

@Entity
public class Porta extends Model {

@Required
public String descricao;

@Enumerated(EnumType.STRING)
public Status status;

@Enumerated(EnumType.STRING)
public StatusEquipamento statusEquipamento;

I think it would be using jquery, but I don’t know how to implement it because I don’t understand this language yet.