在可排序表之外删除行时,Jquery UI可排序ie7问题

时间:2013-03-14 16:20:01

标签: jquery-ui internet-explorer-7 jquery-ui-sortable jquery-ui-droppable

在ie8上,我的可排序列表一切正常。但是,我在ie7上遇到了问题。

我的页面设置了每个员工的表格。有一个需要分配的作业列表,我将这些作业行拖放到员工表中。

起初,我遇到的问题是我无法进入已经空的员工表,但我通过在每个表中使用.dontinclude行的组合并添加接收函数来解决此问题(请参阅下文):

jQuery_1_9_1(function() {
            jQuery_1_9_1('[id$="' + tname + '"] ').sortable({
                items: "tr:not(.dontinclude)",
                connectWith: ".connectedSortable ",
                receive:  function(ev, ui) {
                    //debugger;
                    ui.item.parent().find('tbody').append(ui.item);
                }
            }).disableSelection();
        });

我在创建表时添加.dontinclude行(它们是动态构建而不是声明),这意味着它是第一行。在添加之前

:not(.dontinclude)

行不会添加到空表。添加该行后,它们会添加到表中,但它们会在tbody标记之后添加,这是没用的。在接收后添加指定的 where 添加的接收函数,意味着元素现在出现在tbody中。

所以,在ie8中一切正常,直到我发现有些用户会在ie7上。一切都很顺利,直到我不小心拖了一下拖拉,但没有超过我的一个可排序的桌子。结果是它完全消失了。我检查了DOM页面,行再次添加了tbody的外部(可能导致它们在ie7上消失)。如果我在receive函数中放置一个调试器,我发现在这个实例中没有调用该函数 - 只有当我在一个可排序的表上时才调用它。

所以我认为我需要找到一个项目被丢弃到可排序区域之外时调用的行为,并且可能会覆盖它。

这可能吗?也许与jquery droppable有关?

1 个答案:

答案 0 :(得分:0)

好的,我到了这个底部。

看起来我最初过于复杂。

无需使用接收功能。

jQuery_1_9_1(function() {
            jQuery_1_9_1('[id$="' + tname + '"] tbody ').sortable({
                items: "tr:not(.dontinclude)",
                connectWith: ".connectedSortable tbody"
            }).disableSelection();
        });

我只需要在选择器和connectWith中指定tbody。除了拥有.dontinclude行(在我的表中,这只是表头行)之外,这似乎解决了这个问题,并确保仍然在 tbody标记中添加值。

编辑我还应该添加,我的'tname'id和class'sortable'在table标签上指定。