Tag: jquery ui sortable

如何在ui-sortable中手动触发’update’

我正在使用一个UI可以在每个项目中排序一个delete按钮。 这是删除function: $(‘.delete_item’).click(function(){ $(this).closest(‘.grid_3_b’).remove(); initSortable(); $(“.sortable”).sortable(‘refresh’).trigger(‘update’); }); 我想删除div get,但是没有发送给PHP的update数据..所以我的脚本不会保存订单和删除的项目.. 这是我的initSortable(); function: function initSortable() { $( “.sortable” ).sortable({ items: ‘.grid_3_b, .dropable’, connectWith: “.sortable”, placeholder: “placeholder”, remove: function(event, ui) { if(!$(‘div’, this).length) { $(this).next(‘.dropable’).remove(); $(this).remove(); } initMenu(); }, receive: function(event, ui) { if( $(this).hasClass( “dropable” ) ) { if( $(this).hasClass( “gallery__item–active” ) ) { $(this).before( “” ); […]

jQuery-UI可拖动和可排序

所以我一直在使用这个例子: http : //jqueryui.com/demos/draggable/#sortable我已经在我的产品上完成了它。 但是我想做两个重大改变。 我不希望第二个列表(在我的示例中为toList)可以自行排序。 我只希望它接受第一个列表中的项目(在我的例子中是fromList)。 当用户从第一个列表(fromList)拖动项目并将其放入第二个列表(toList)时,我希望该项目被强制到底部。 建议? 这是我到目前为止所做的工作。 http://jsfiddle.net/CrtFD/

jQuery sortable(’disable’)来自start事件并不像预期的那样完全正常工作

以下代码不会完全禁用start事件的sortables。 它会将类ui-sortable-disabled和ui-state-disabled到可排序元素中,但它不会禁用该function – 换句话说,sortables看起来已禁用,但它们仍然接受拖动的项目并且表现得像它们一样已启用。 var assignedSortables; var startDrag = function(event, ui) { assignedSortables.each(function() {$(this).sortable(‘disable’);}); }; var stopDrag = function(event, ui) { assignedSortables.each(function() {$(this).sortable(‘enable’);}); }; assignedSortables = $(“.my-sortable-containers”).sortable({ connectWith: ‘.my-sortable-containers’, start: startDrag, stop: stopDrag }); 我想要这样做的原因是拖动启动是因为我可能需要禁用已经包含被拖动项目的其他已连接的可排序项(为了简化我省略了逻辑)。 这是一个错误还是有办法绕过它?

jQuery可排序/禁用选择问题

我的jQuery可排序列表存在问题,正在选择文本。 我发现函数disableSelection()但似乎无法让它工作。 这是js: $(‘ul#current_projects’).sortable({ placeholder: “drop-zone”, axis: ‘y’, handle: ‘span.handle’, opacity: 0.5, revert: true }); $(‘ul#current_projects’).disableSelection(); 这是HTML: Testing Testing 似乎不可选择的状态已开启,但只是不会阻止文本选择。 任何帮助,将不胜感激

jQuery是否总是按照代码中的顺序遍历DOM?

比方说,我有一个可排序的列表: Item 1 Item 2 Item 3 我想知道的是,如果我进行如下的jQuery调用: $.each($(‘li’), function(key, item) {…}); 我可以期待jQuery从上到下遍历条目吗? 我已经运行了一些测试,并尝试使用jQueryUI动态重新排列项目,到目前为止,它似乎总是按顺序运行。 但这总是可以预料到的吗? 或者是运气不好,到目前为止我还没有碰到任何东西让我想到其他方面……?

jQuery UI可排序 – 无法将元素拖动到连接列表/列的底部

我遇到了jQuery sortables的问题。 我正在使用它通过创建3列来开发类似iGoogle的仪表板。 所有3都包含可排序的div,并使用connectWith选项相互连接。 我遇到的问题是当尝试在可排序列的底部删除div时; 它只是不想发生。 只有当我将它拖过已经在我拖动到的列表中的最底部的div时,它才有效。 有什么方法可以避免这种情况吗? 或者也许创建一个固定在每列底部的虚拟div? 任何有关这方面的帮助将非常感谢! 提前致谢。

如何处理从SAPUI5中的ListBox拖放?

我发现SAPUI5支持拖放function。 但我无法在我的应用程序中实现相同的function。 我试图绑定到dragstart和dragleave事件,它们不起作用。 我甚至尝试在其他线程( http://jsbin.com/qova/2/edit?html,output )中提供示例。 这个例子也不起作用。 我可以选择列表项,但是当我尝试拖动时,选择只是扩展而没有任何反应。 如果我做错了,请告诉我。 这是HTML快照 源代码 Drag and Drop List Test $.sap.require(‘sap.ui.thirdparty.jqueryui.jquery-ui-core’); $.sap.require(‘sap.ui.thirdparty.jqueryui.jquery-ui-widget’); $.sap.require(‘sap.ui.thirdparty.jqueryui.jquery-ui-mouse’); $.sap.require(‘sap.ui.thirdparty.jqueryui.jquery-ui-draggable’); $.sap.require(‘sap.ui.thirdparty.jqueryui.jquery-ui-sortable’); $(function() { $(“#lb1-list, #lb2-list”).sortable({ connectWith : “.ui-sortable” }).disableSelection(); }); var city1 = “Berlin|London|New York|Paris|Amsterdam”, city2 = “Sydney|Melbourne|Brisbane|Perth|Wollongong”; var oListBox1 = new sap.ui.commons.ListBox( “lb1”, { items : $.map(city1.split(“|”).sort(), function(v, i) { return new sap.ui.core.ListItem({ text […]

jQuery UI嵌套可排序

我无法在jQuery UI中使嵌套元素可排序。 我在按钮的单击function上创建元素并附加它。在附加的元素中,我无法进行嵌套排序。 请帮助我使嵌套元素排序,这些元素是在点击按钮时动态创建的。 代码如下。 $(function () { $(‘.inner’).sortable({ items: “.sortable-inner” }); $(‘.outer’).sortable({ items: “.sortable-outer” }); }); (function () { var i = 0; $(“#singleText”).live(‘click’, function () { var $ctrl = $(‘ Required.? Is Mandatory? remove ‘); $(“.outer”).append($ctrl).addClass(“questionInContailer”); }); $(“#optionsQuestions”).live(‘click’, function () { var $ctrl = $(‘Outer Item 1Inner Item 1Inner Item 2Inner Item 3Outer […]

jquery嵌套可排序列表

我有这个代码 $(document).ready(function() { $(“#test-list”).sortable({ items: “> li”, handle : ‘.handle’, axis: ‘y’, opacity: 0.6, update : function () { var order = $(‘#test-list’).sortable(‘serialize’); $(“#info”).load(“process-sortable.asp?”+order+”&id=catid&order=orderid&table=tblCats”); } }); $(“#test-sub”).sortable({ containment: “ul”, items: “li”, handle : ‘.handle’, axis: ‘y’, opacity: 0.6, update : function () { var order = $(‘#test-list’).sortable(‘serialize’); $(“#info”).load(“process-sortable.asp?”+order+”&id=catid&order=orderid&table=tblCats”); } }); }); 对于这种UL 但是它可以动态地改变…当我拖放主要的li它正在工作当我和孩子们一起工作它会拖动主要的一个 怎么了?

jQuery可以使用droppable进行排序

我的小提琴: http : //jsfiddle.net/Yc9WY/42/ 你在这里看到的是两组,每组有3个可放置的容器。 您可以将事件从组1移动到组2,并移动到任何插槽中。 这很好用。 一旦一个组已满,我想让用户能够通过上下移动事件来对该组进行排序。 如果他们选择,他们仍然可以将事件移出组。 您将看到我注释掉的代码,我开始集成可排序的库,但我的行为很奇怪。 注意:我无法单独替换我的draggable / dropable。 我需要明确定义可放置区域(每组3个),以便事件可以存在于组1的插槽1和3中。 这是我的代码 $(document).ready(function() { // $(“.sort”).sortable({ // revert: true // }); $(“.drag”).draggable({ //connectToSortable: “.sort”, revert: true //helper: clone }); $(“.sort”).droppable({ drop: function(event, ui) { if (!($(this).children(“.drag”).size() == 1)) { $(this).append(ui.draggable); ui.draggable.css({ left: 0, top: 0 }); } } }); }); Group 1: […]