web-dev-qa-db-ja.com

EJSでのHTML選択オプション

Webアプリケーションの構成を作成しています。それをWebページにレンダリングしてみてください。以下は私のコードの一部です。 config[0].volumeが持っているオプションを選択したい。したがって、config[0].volumeが「50」の場合、選択されたオプションは「50」になります。コードは正常に機能しています。しかし、私は疑問に思いました。 「どうすればこのコードを短くできますか？」だから私のコードで冗長。

<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>

2時間ぐらいだと思いますが、なにも出ません。たぶん私はjQueryまたはJavaScriptを使用し、それに属性を追加する必要があります、

attr('selected')... ?

わかりません。手伝っていただけませんか？

javascriptjqueryejs
13
Juntae

オプションの値に基づいてループに入れることができます。

<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

現在の答えに誤りがあったので、見つけた解決策を共有したいと思いました。

私の例では、目覚まし時計を作成していて、入力の選択ドロップダウンに「時間」値（0〜12）が必要でした。

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

name="hour"は、POSTリクエストを介して渡されるときに、選択された値を識別するために使用されます。同様のセットを実行していると仮定すると、req.body.hourを使用してこの値を取得できます。アップ。

  • サーバー側：Node.js/Express
  • クライアント側：EJS/HTML
1
mster