web-dev-qa-db-fra.com

Option de sélection HTML avec EJS

Je fais une configuration pour mon application Web, essayez de la rendre sur la page Web. Ci-dessous fait partie de mon code. Je veux l'option sélectionnée pour le config[0].volume a. Donc si config[0].volume est '50', L'option sélectionnée sera '50'. Les codes fonctionnent bien. Mais je me suis demandé. 'Comment puis-je raccourcir ce code?' Donc verbeux avec mon code.

<select id="volume">

  <option value="1" <%= config[0].volume == '1' ? 'selected' : ''%>>1</option>
  <option value="5" <%= config[0].volume == '5' ? 'selected' : '' %>>5</option>
  <option value="10" <%= config[0].volume == '10' ? 'selected' : '' %>>10</option>
  <option value="50" <%= config[0].volume == '50' ? 'selected' : '' %>>50</option>
  <option value="75" <%= config[0].volume == '75' ? 'selected' : '' %>>75</option>
  <option value="100" <%= config[0].volume == '100' ? 'selected' : '' %>>100</option>

</select>

Je pense environ 2 heures, mais rien ne vient. Peut-être que je dois utiliser jQuery ou JavaScript, et ajouter un attribut à l'a,

attr('selected')... ?

Je n'en ai aucune idée, pourriez-vous m'aider?

javascriptjqueryejs
13
Juntae

Vous pouvez le mettre en boucle en fonction des valeurs des options.

<select id="volume">

<%
var options = [ "1", "5", "10", "50", "75", "100" ];
for ( var i = 0; i < options.length; i++ )
{
    var selected = ( config[0].volume == i ) ? "selected" : "";
    %><option value="<%=options[ i ] %>" <%=selected %>><%=i %></option><%
}
%>
</select>
18
Don Rhummy

J'ai eu une erreur avec la réponse actuelle, alors je voulais partager ma solution que j'ai trouvée.

Pour mon exemple, je crée un réveil et je voulais des valeurs d'heures dans une liste déroulante sélectionnée pour l'entrée (0 à 12).

<select name="hour">
  <% var options = []; %>
  <% for(var i = 0; i <= 12; i++) { %>
    <option value='<%= i %>'><%= i %></option>
  <% } %>
</select>

Notez que name="hour" est utilisé pour identifier la valeur sélectionnée lorsqu'elle est passée par une requête POST. Vous pouvez obtenir cette valeur en utilisant req.body.hour en supposant que vous exécutez une configuration similaire.

  • Côté serveur: Node.js/Express
  • Côté client: EJS/HTML
1
mster