Member Avatar for shrutib

Hello All,
I am having the drop down list with count 1 to 10 which is looped for itemlist. For item 1 dropdown list shows count 1 to 10,item 2 also dropdown list shows count 1 to 10 and so on. I want to preset the value for the drop down list which should display on page load like for item 1 drop down value count set to 1, for item 2 drop down value count set 2.. and so on. How can i acheive this please let me know. Code is attached for the drop down list. Want the solution in html/javascript/ruby on rails.

<select id="order_of_display" name="order[display]">
                                                    <option value="0" selected ="selected">Select order</option>


                                                            <% if  @items[:active] %>
                                                                 <%for i in (1..@items[:active].size) %>

                                                    <option value=" <%= i  %>" > <%= item.id %> </option>

                                                                <% end %>
                                                          <% end %>
                                                  </select>
  • 3 Contributors
  • 2 Replies
  • 124 Views
  • 3 Days Discussion Span
  • Latest Post Latest Post by Webville312

Dani AI

Generated

Short answer: generate each select with a unique name/id and set its selected value from the item index (or from the item's stored order if available). The code in the thread shows an ERB loop that creates identical selects; that causes duplicate id/name problems and makes preselecting unreliable. was right to ask about language — the tags and ERB snippets indicate Ruby on Rails — and 's point about readable code applies: use Rails helpers (or a small JS fallback) instead of hand-rolling identical option blocks.

Example (Rails helpers, sets default to stored item.position or index+1 if none):

<% @items[:active].each_with_index do |item, idx| %>
  <%= select_tag "orders[display][#{item.id}]",
      options_for_select((1..@items[:active].size).map { |i| [i, i] }, item.position || (idx + 1)),
      id: "order_display_#{item.id}", class: "order-display" %>
<% end %>

Small JS fallback (runs on page load, useful when default value isn't set server-side):

document.addEventListener('DOMContentLoaded', function () {
  document.querySelectorAll('.order-display').forEach(function (sel, i) {
    if (!sel.querySelector('option[selected]') && !sel.value) sel.value = String(i + 1);
  });
});

Practical notes and troubleshooting:

  • Never reuse the same id for multiple selects; use a per-item id (example uses order_display_#{item.id}).
  • Use distinct names like orders[display][<item_id>] so each select maps back to the correct item on submit; orders[display] repeated will lose data.
  • Prefer a persistent field (e.g., item.position) instead of relying on DOM order; index-based defaults fail if items get reordered.
  • Keep labels and values consistent (both numeric if selecting an order), and ensure the selected value type (string vs integer) matches what helpers/JS expect.

Recommended Answers

All 2 Replies

Member Avatar for Member #949455

I am having the drop down list with count 1 to 10 which is looped for itemlist. For item 1 dropdown list shows count 1 to 10,item 2 also dropdown list shows count 1 to 10 and so on.

What language is this? Is it JSP or ASP.net? Why did you post this in CSS?

The example has nothing to do with CSS, it seems it involve the database or an array?

Want the solution in html/javascript/ruby on rails.

What solution? What is active? How can anyone add a code with the code you provided? It doesn't make any sense.

Member Avatar for Webville312

It is always a good practice to keep your code clean and readable. You could do just that, then re-post it

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.