如何在rails中显示一定数量的数组项

发布于 2024-11-29 23:02:09 字数 1816 浏览 0 评论 0原文

我有一个数组,我想一次只显示 4 个项目,当我单击“下一步”时,它将显示接下来的 4 个项目。 查看代码:

<table>
<tr>
  <th></th>
  <th>3</th>
  <th>2</th>
  <th>1</th>
  <th>1</th>
  <th>2</th>
  <th>3</th>
  <th></th>

</tr>
<% count = 0 %> 
<% while count < 4%>
  <tr class="match_row" value="<%=count%>">
    <th id="left_competitor"><%= @matches[count][0].title %></th>
    <% (1..6).each do |i|%>
      <th>  <input type="radio" class="group_<%=count%>" name="<%=count%>" value="<%= i%>"><br></th>
    <% end %>
    <th id="right_competitor"> <%= @matches[count][1].title %></th>
  </tr>
  <br />
  <% count += 1 %>
<% end %>
<br />
</table>
<input id="save_votes" type="button" value="Next">

现在这是 CoffeeScript 代码:

move_to_next_match = ->
  $("#save_votes").click -> display_next_competitors()

display_next_competitors = ->
  project_id = document.getElementById("project_id").value
  match_rows = $('.match_row')
  results = []
  for i in [0...match_rows.length]
    do (i) ->
      radios = $(".group_#{i}")
      for j in [0...radios.length]
        do (j) ->
          if radios[j].checked
            count = radios[j].getAttribute 'name'
            number = radios[j].getAttribute 'value'
            results.push("#{count} #{number}")
  data = "{\"get_matches_results\": \"#{results}-#{project_id}-#{marker}\"}"
  $.ajax({
  type: "POST"
  url: "projectss/pca_results"
  data: "data=" + data
  })
  location.reload(true);

我的想法是让视图中的变量计数 (<%count = 0%>) 取变量的值而不是 0,但我不知道该怎么做这。 有什么想法吗?

I have an array and I want to display only 4 items at a time and when I click on Next it will display the 4 next items.
View Code :

<table>
<tr>
  <th></th>
  <th>3</th>
  <th>2</th>
  <th>1</th>
  <th>1</th>
  <th>2</th>
  <th>3</th>
  <th></th>

</tr>
<% count = 0 %> 
<% while count < 4%>
  <tr class="match_row" value="<%=count%>">
    <th id="left_competitor"><%= @matches[count][0].title %></th>
    <% (1..6).each do |i|%>
      <th>  <input type="radio" class="group_<%=count%>" name="<%=count%>" value="<%= i%>"><br></th>
    <% end %>
    <th id="right_competitor"> <%= @matches[count][1].title %></th>
  </tr>
  <br />
  <% count += 1 %>
<% end %>
<br />
</table>
<input id="save_votes" type="button" value="Next">

Now here is the CoffeeScript code :

move_to_next_match = ->
  $("#save_votes").click -> display_next_competitors()

display_next_competitors = ->
  project_id = document.getElementById("project_id").value
  match_rows = $('.match_row')
  results = []
  for i in [0...match_rows.length]
    do (i) ->
      radios = $(".group_#{i}")
      for j in [0...radios.length]
        do (j) ->
          if radios[j].checked
            count = radios[j].getAttribute 'name'
            number = radios[j].getAttribute 'value'
            results.push("#{count} #{number}")
  data = "{\"get_matches_results\": \"#{results}-#{project_id}-#{marker}\"}"
  $.ajax({
  type: "POST"
  url: "projectss/pca_results"
  data: "data=" + data
  })
  location.reload(true);

My idea is to let the variable count in view (<%count = 0%>) take the value of a variable instead of 0 but I can't figure out how to do this.
Any ideas ?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

挖个坑埋了你 2024-12-06 23:02:09

这看起来像你的视图模板中有很多逻辑,让我更多地想起了 PHP。

也许您可以看一下: http://railscasts.com/episodes/174- pagination-with-ajax

Ryan 使用 Gem 来处理分页(Lookup Kaminari 或 WillPaginate),然后使用无障碍 jQuery 来处理 AJAX 组件。

This looks like a lot of logic in your view templates, reminds me more of PHP.

Maybe you can table a look at this: http://railscasts.com/episodes/174-pagination-with-ajax

Ryan uses a Gem to handle the pagination (Lookup Kaminari or WillPaginate) and then uses unobstructive jQuery to handle the AJAX component.

闻呓 2024-12-06 23:02:09

代码有关,

$.ajax({
type: "POST"
url: "projectss/pca_results"
data: "data=" + data
})
location.reload(true);

从您的问题中尚不完全清楚您遇到的问题,但我猜测它与向服务器发送请求的 该请求可能会更改页面的内容,然后立即刷新页面而无需等待回复。这里存在一个竞争条件:有时页面会在其内容更新之前刷新,有时会在其内容更新之后刷新。您应该编写

$.ajax({
type: "POST"
url: "projectss/pca_results"
data: "data=" + data
success: -> location.reload(true);
})

以确保仅在处理更新后刷新页面。或者,更好的是,编写一个成功回调来更新页面上的 HTML,而不是刷新整个页面。您的用户会感谢您。

It's not entirely clear from your question what problem you're experiencing, but I'm guessing that it has to do with the code

$.ajax({
type: "POST"
url: "projectss/pca_results"
data: "data=" + data
})
location.reload(true);

which sends a request to the server that potentially changes the page's content, then immediately refreshes the page without waiting for a response. There's a race condition there: Sometimes the page will refresh before its content is updated, sometimes after. You should instead write

$.ajax({
type: "POST"
url: "projectss/pca_results"
data: "data=" + data
success: -> location.reload(true);
})

to ensure that the page is refreshed only after the update is processed. Or, better yet, write a success callback that updates the HTML on the page then and there, rather than refreshing the entire page. Your users will thank you.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文