JQuery sortierbare Elemente nicht sortierbar und positioniert Zeiger

Mein Problem ist, dass ich Elemente in meiner ungeordneten Liste nicht sortieren kann. Der Platzhalter wird immer in der ersten Zeile angezeigt, in der sich das erste Element befindet. (wenn ich Element ziehe). Oder-Elemente bewegen sich überhaupt nicht und geben dem gerade gezogenen Element keinen Platz (was die Standardfunktionalität von sortable sein sollte).JQuery sortierbare Elemente nicht sortierbar und positioniert Zeiger

Here my code pen example

(Elemente zur Liste hinzuzufügen, klicken Sie einfach auf ‚Hinzufügen‘ mehrmals. Sortierbar Funktionalität zu aktivieren, klicken Sie auf Schaltfläche ‚Sortieren‘. Sortierbar Funktionalität Klick ‚Nicht sortierbare‘ zu deaktivieren)

Für sortierbar ich habe Eigenschaften unter:

$("#btnSortable").click(function() { 
    $("#ulNotes").sortable({ 
    handle: '.divText', 
    tolerance: 'pointer', 
    placeholder: 'sortablePlaceholder', 
    forcePlaceholderSize: true, 
    forceHelperSize: true, 
    cursorAt: {left: 0, top: 0}   
    }); 
});

Quelle

2016-07-13 FrenkyB

Wenn Sie class="list-unstyled" entfernen und ein Element über ein anderes Element halten es funktioniert !! Ich denke, dass das Problem dein CSS ist.

Quelle

2016-07-13 12:00:30

Dank. Ich sehe, dass ein anderes Problem ist, Elemente zu sortieren, wenn sie in verschiedenen Spalten sind ... – FrenkyB

Sie sind willkommen –

kurzes Beispiel hier http://codepen.io/ionutmihai1995/pen/mEqzPW –

<head> 

<meta charset="utf-8"> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css"> 
<style> 
    #sortable { list-style-type: none; margin: 0; padding: 0; width: 100%; } 
    #sortable li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; font-size: 1.4em; height: 18px; float:left; border:1px solid black;width:30%;} 
</style> 
<script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script> 
<script> 
    $(function() { 
     $("#sortable").sortable(); 
     $("#sortable").disableSelection(); 
    }); 
</script> 
</head> 
<body> 

    <ul id="sortable"> 
     <li class="ui-state-default">Item 1</li> 
     <li class="ui-state-default">Item 2</li> 
     <li class="ui-state-default">Item 3</li> 
     <li class="ui-state-default">Item 4</li> 
     <li class="ui-state-default">Item 5</li> 
     <li class="ui-state-default">Item 6</li> 
     <li class="ui-state-default">Item 7</li> 
    </ul> 
</body>

Quelle

2016-07-13 13:49:12

JQuery sortierbare Elemente nicht sortierbar und positioniert Zeiger

Antwort

Verwandte Themen