1

我有 jquery 代码来计算表中的当前行（并进行一些算术运算）并将它们添加到列中。我在我的中使用过这个脚本，_form/_partial效果很好。但是，当我在我的内部使用相同的脚本show.html.erb（再次设置同一个表）时，它不起作用。

这是我的_form

<table id="mytable">
    <th>RowNumber</th>
    <th>header2</th>
    <th>header3</th>
    <th>header4</th>  
        <%= f.nested_fields_for :partial do |f|
          render 'partial', f: f
        end -%> 
         <caption align = "bottom"><%= link_to_add_fields "Add Field", f, :manual_iops %></caption>
</table>

_partial.html.erb

<tr>
 <td> 
   <!-- Nothing Goes Here -->   
 </td>

 <td>
  <%= f.text_field :data1 %>
 </td>

 <td>
  <%= f.text_field :data2 %>
 </td>

  <td>
  <%= f.text_field :data3 %>
 </td>

</tr>

  <script>
   $('tr').each(function(){
     var index= $('#mytable').children('tr').index($(this))
     if(index == 0){
       var position= 5;
     }
     if(index == 1){
       var position = 10;
     }
     if(index == 2){
       var position = 15;
     }
     if(index == 3){
       var position = 20;
     }
     if(index > 3){
       var position = (index-1)*10
     }
     $(this).children('td').first().html(position);
  })
</script>

现在这是我在节目中尝试的内容：

显示.html.erb

<table id="mytable">
  <th>RowNumber</th>
  <th>header1</th>
  <th>header2</th>
  <th>header3</th>
     <% @data_sheet.partials.each do |c| %>
    <tr>
      <td></td>
      <td><%= c.data1 %></td>
      <td><%= c.data2 %></td>
      <td><%= c.data3 %></td>
    </tr>
  <script>
     $('tr').each(function(){
         var index= $('#mytable').children('tr').index($(this))
         if(index == 0){
               var position= 5;
         }
         if(index == 1){
               var position = 10;
         }
         if(index == 2){
               var position = 15;
         }
         if(index == 3){
               var position = 20;
         }
         if(index > 3){
               var position = (index-1)*10
         }
        $(this).children('td').first().html(position);
    })
  </script>
     <% end %>
</table>

这是我的_form外观图像，您可以看到第一列具有值：5, 10, 15, 20，因为我的脚本在partial.html.erb计算行数并执行了一些 + 和 *： 在此处输入图像描述

这是我的，由于我的问题show.html.erb，它显示了一个空列（应该填充5,10,15,20）。我在这里从我的部分运行相同的脚本：

在此处输入图像描述

那么在这种情况下我做错了什么？我看到的唯一不同的是我的循环和我没有渲染部分的事实，但我看不出这会影响我的 javascript 的原因。我真的把我的头撞到墙上了。

4

2 回答 2

1

编辑：

哇，我没有意识到你在循环那个脚本。你是故意的吗？尝试将您的节目更改为：

<table id="mytable">
  <th>RowNumber</th>
  <th>header1</th>
  <th>header2</th>
  <th>header3</th>
     <% @data_sheet.partials.each do |c| %>
    <tr>
      <td></td>
      <td><%= c.data1 %></td>
      <td><%= c.data2 %></td>
      <td><%= c.data3 %></td>
    </tr>
     <% end %>
</table>  

  <% content_for :scripts do %>
    <script>
       $(document).ready(function(){
         $('tr').each(function(){
             var index= $('#mytable').children('tr').index($(this))
             if(index == 0){
                   var position= 5;
             }
             if(index == 1){
                   var position = 10;
             }
             if(index == 2){
                   var position = 15;
             }
             if(index == 3){
                   var position = 20;
             }
             if(index > 3){
                   var position = (index-1)*10
             }
            $(this).children('td').first().html(position);
        });
      });
      </script>
   <% end %>

旧答案

主要问题可能是在文档准备好之前调用的脚本，因此请尝试包装 document.ready 函数。此外，为了增加预防措施，请将其放在</body>标签之前。

尝试在 application.html.erb 中的标签<%= yield :scripts %>之前放置</body>

现在在您的部分放置中：

  <% content_for :scripts do %>
    <script>
       $(document).ready(function(){
         $('tr').each(function(){
             var index= $('#mytable').children('tr').index($(this))
             if(index == 0){
                   var position= 5;
             }
             if(index == 1){
                   var position = 10;
             }
             if(index == 2){
                   var position = 15;
             }
             if(index == 3){
                   var position = 20;
             }
             if(index > 3){
                   var position = (index-1)*10
             }
            $(this).children('td').first().html(position);
        });
      });
      </script>
   <% end %>
于 2013-08-29T20:46:42.197 回答
1

好的，如果你想用 ruby​​ 做到这一点，这很容易：

<table id="mytable">
  <th>RowNumber</th>
  <th>header1</th>
  <th>header2</th>
  <th>header3</th>

  <% @count = 5 %>  
  <% @data_sheet.partials.each do |c| %>
    <tr>
      <td><%= @count %></td>
      <td><%= c.data1 %></td>
      <td><%= c.data2 %></td>
      <td><%= c.data3 %></td>
    </tr>
  <% if @count >= 20 %>
    <% @count = @count + 10 %>
  <% else %> 
    <% @count = @count + 5 %>  
  <% end %>
</table>

您可以将 if 和语句重写为：

<% @count >= 20 ? (@count = @count + 10) : (@count = @count + 5) %>
于 2013-08-30T05:48:17.407 回答