CODEWITHSUNDEEP
javascriptjqueryinternet-explorerjquery-uiinternet-explorer-9
NullVoxPopuli
NullVoxPopuli

Reputation: 65173

IE9 & jQuery: Sorting list items works in modern browsers and IE7, but not IE9.

Not really sure what is going on here. It doesn't work in IE9. Maybe IE9 doesn't handle JavaScript properly? Works in Chrome, FF, Safari, IE7 (I've actually tested these)

Here is my code in a fiddle: http://jsfiddle.net/SMqR9/31/

Not too complicated, just nested sorting. What is happening? Is there something special I need to do for IE9?

the javascript in question:

$j = jQuery.noConflict();
$j(function() {

 // these parts are here due to a z-index bug with IE
    $j('ul').bind('mousedown', function(e) {
        e.stopPropagation();
        if ($j.browser.msie && $j.browser.version < '9.0') $j(this).closest('.section').css('z-index', '5000');
    });
    if ($j.browser.msie && $j.browser.version < '9.0') {
        $j('ul').bind('mouseup', function(e) {
            $j(this).closest('.section').css('z-index', '1000');
        });
    }
// the actual sorting code / jqueryUI sorting
    $j("#sort_content_41,#sort_content_40,#sort_content_42,#sort_content_39").sortable({
        connectWith: '.section-content',
        dropOnEmpty: true,
        zIndex: 1004,
        cursor: 'crosshair'
    });
    $j("#sort_sections").sortable({
        placeholder: "ui-state-highlight",
        connectWith: '.sections',
        axis: 'y',
        zIndex: 1003,
        cursor: 'crosshair'
    });
});

$j(function() {
    $j("section-content").sortable({
        connectWith: "section-content",
        dropOnEmpty: true
    });
    $j(".section-content").disableSelection();
});

Upvotes: 2

Views: 999

Answers (2)

Sheikh Abdur Rahman
Sheikh Abdur Rahman

Reputation: 53

Those who can't upgrade jQuery to the latest version for some reason, there are hot fixes for drag-and-drop mouse interactions.

See the following link:

http://forum.jquery.com/topic/jquery-ui-does-not-work-on-ie9

I have also faced similar problem. I have fixed the problem by adding the following code at the end of ui.core.js

(function ($) {
    var a = $.ui.mouse._mouseMove;
    $.ui.mouse._mouseMove = function (b) {
        if ($.browser.msie && document.documentMode >= 9) {
            b.button = 1
        };
        a.apply(this, [b]);
   }
}(jQuery));

Upvotes: 1

duri
duri

Reputation: 15351

The solution is to update jQuery to the latest version. Older versions don't work properly under IE9.

Upvotes: 1

Related Questions