大佬教程收集整理的这篇文章主要介绍了jquery – 具有可扩展行的可排序表,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
(function($){ $.fn.jSortable = function(){ var element = this; var fixHelper = function(e,ui) { ui.children().each(function(){ $(this).width($(this).width()); }); return ui; }; $(element).sortable({ helper: fixHelper,axis: "y",cursor: "move",items: "tr.odd2",distance: "30" }); $(element).disableSelection(); }; })(jQuery);
父行具有类odd2,子行具有类child.
当应用.sortable()时,将2行锁定在一起的正确方法是什么?
我目前正在使用带有jquery-rails 1.0.19的rails 3.1.1
编辑:
这是相关的html
<table id="sortableTable"> <tr class= 'headings'> <th><%= sortable "number" %></th> <th><%= sortable "customer_id" %></th> <th><%= sortable "priority" %></th> <th><%= sortable "quantity" %></th> <th><%= sortable "due_date" %></th> <th></th> </tr> <% @jobs.each do |job| %> <tr class= "odd2"> <td><%= job.number %></td> <td><%= job.customer %></td> <td><%= job.priority %></td> <td><%= job.quantity %></td> <td><%= job.due_date %></td> <td><%= button 'Edit',edit_job_path(job) %></td> </tr> <tr class= "child"> <td><%= job.job_items %></td> </tr> <% end %> </table> <%= javascript_tag do %> $(document).ready(function(){ $('#sortableTable tbody').jSortable(); }); <% end %>
编辑2:我已经使用jquery-rails 2.0.0将我的应用程序更新到Rails 3.2.1
如果没有,请发布您的HTML,以便更容易看到您要执行的操作.
具体来说,请注意可排序项如何是div并且具有子项的div.
<div class="portlet"> <div class="portlet-header">Feeds</div> <div class="portlet-content">Lorem ipsum dolor sit amet,consectetuer adipiscing elit</div> </div>
以上是大佬教程为你收集整理的jquery – 具有可扩展行的可排序表全部内容,希望文章能够帮你解决jquery – 具有可扩展行的可排序表所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。