开发者

Why isn't scrolling working in my jQuery UI sortable?

开发者 https://www.devze.com 2022-12-24 04:33 出处:网络
I\'m having problems using the sortable function of jQuery UI. The scroll doesn\'t seem to work. If the second list ( lists are created on the table rows in a tbody and each tbody is connect ) isn\'t

I'm having problems using the sortable function of jQuery UI. The scroll doesn't seem to work.

If the second list ( lists are created on the table rows in a tbody and each tbody is connect ) isn't visible I want it to be possible to 开发者_JAVA技巧scroll towards it for dropping my table row.

This is my HTML set up:

<ul>
    <li>
        <ul>
            <li>
                <table class="treeleerling">
                    <tbody class="oder0">

                        <tr class="suborder0">

                        </tr>
                        <tr class="sub1order">

                        </tr>
                    </tbody>
                </table>
            </li>
        </ul>
    </li>
    <li>
        <ul>
            <li>
                <table class="treeleerling">
                    <tbody class="oder1">

                        <tr class="suborder0">

                        </tr>

                        <tr class="suborder1">

                        </tr>
                    </tbody>
                </table>
            </li>
        </ul>
    </li>
</ul>

And jQuery code

$(document).ready(function() {
    $("#left tbody").sortable({
            connectWith : '#left tbody',
            scroll : true,
            scrollSensitivity: 40,
    });
});

The sorting works fine, but the scrolling doesnt.. I'm doing something wrong or what?

Update : I refactored the code to use only listitems in a list instead of table rows in a table body. Same problem still occurs


This may not apply to your case, but I thought I would post my solution to a scolling problem with jQuery sortable that I was having. I'm not using a scrolling div. To get scrolling to work, I had to remove this line from my stylesheet:

body {
  overflow-x: hidden; /* this line kept page scrolling from working */
}

I also set the sortable 'containment' option to 'document' (which kept the item from being dragged left/right off the page, which is also what I needed).


I just stumbled upon this. Might be too late for you but for any future visitors:

Had this problem and I had to delete the following line out of my css:

#sortable{overflow: auto;} /*delete this */

So I guess any kind of overflow assigned to the sortable could be the problem.


Sorry I cannot detect any error in your code due to my limited understanding of the jQuery UI library. BTW, where is the code for scrolling down to the div of destination?

Here is another way to walk around this issue, use another jQuery plugin : ScrollTo, instead.

To use it is simple, once the plugin is loaded, use code as this:

$.scrollTo('#your_target_element_id');

I have been using it in my projects, and it seems still okay with jQuery 1.4.2

Hope this helps :)

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号