Search Results

Search found 14 results on 1 pages for 'sortables'.

Page 1/1 | 1 

• MooTools Sortables with horizontal list having problems

  - by Anurag

  I am having problems sorting list items using the Sortables class when the list items are displayed horizontally. Removing this style fixed everything: display: inline Created an example on jsfiddle. This works. Check the stylesheet for .countries li - it does not display the list inline - http://jsfiddle.net/Wgpqw/ This does not work properly. I can drag the list items around the list, but the sort randomly happens when moving around - http://jsfiddle.net/Wgpqw/1/ I suspect it has something to do with the list element positioning in inline mode. Any help is greatly appreciated.

  Read the article

• jQuery — Nested Sortables Plugin — Disabling sortability between parents

  - by AJB

  I've got a question that I think is simple but I've not been able to figure it out. This is in regard to this plugin: http://mjsarfatti.com/sandbox/nestedSortable/ Essentially, I want to disable the ability to sort children outside of their parents. So, I've got this: CATEGORY 1 ITEM 1.1 ITEM 1.2 ITEM 1.3 CATEGORY 2 ITEM 2.1 ITEM 2.2 ITEM 2.3 So, I'd like to provide the ability for users to sort the children within their category, and the ability to sort the categories themselves. But I want to disable the ability to move a child to another parent. (e.g. ITEM 1.1 cannot be moved to CATEGORY 2). And also I would like to disable the abilty to nest any parents in any children. I tried setting it so that the 'nestedSortable' function is called for every new OL but that simple disables sorting for everything entirely. Thanks for any help.

  Read the article

• ul sortables get serialized data

  - by russp

  Hi folks Any ideas how to get the serilized data from this function? the html is first with the JQuery function last, I cannot get the serialization to appear in the alert. When I can do that I can finish this by sending via ajax etc... <div class="column" id="col1"> <div class="portlet"> <div class="portlet-header">Feeds</div> <div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div> </div> <div class="portlet"> <div class="portlet-header">News</div> <div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div> </div> Shopping Lorem ipsum dolor sit amet, consectetuer adipiscing elit Links Lorem ipsum dolor sit amet, consectetuer adipiscing elit Images Lorem ipsum dolor sit amet, consectetuer adipiscing elit $(function() { $("#col1, #col2, #col3").sortable({ connectWith: '.column', receive : function () { serial = $('#col1').sortable('serialize'); //serial2 = $('#col2').sortable('serialize'); //serial3 = $('#col3').sortable('serialize'); alert(serial); } }); });

  Read the article

• JQUERY - jQuery UI Nested Sortables 2 - help getting it working

  - by nobosh

  Hello, I'm interested in using the following JQUERY - http://lucaswoj.com/2010/01/jquery-ui-nested-sortables-2/ However, I can't seem to get a demo instance of the plugin work. Here's the code I'm using: <script type="text/javascript"> $('#findit').nestedSortable({}); </script> <div > <ul id="findit"> <li> List Item Content <ul></ul> <li> <li> List Item Content 2 <ul></ul> <li> <li> List Item Content 3 <ul></ul> <li> <li> List Item Content 4 <ul></ul> <li> <ul> </div> Any ideas? Thanks

  Read the article

• jQuery nested sortables jumpy behaviour

  - by sebbie

  I want to allow user to drag and drop UI elements. I've 'container' and 'control', control may be in container, containers may include other containers (this is important requirement). I created simple prototype using jQuery. HTML: <div class="one"> <div class="control">Control 1</div> <div class="control">Control 2</div> <div class="control container"> Container drag area <div class="control">Subcontrol 1</div> <div class="control">Subcontrol 2</div> <div class="control">Subcontrol 3</div> <div class="control">Subcontrol 4</div> <div class="control">Subcontrol 5</div> <div class="control">Subcontrol 6</div> <div class="control">Subcontrol 7</div> <div class="control">Subcontrol 8</div> <div class="control">Subcontrol 9</div> </div> <div class="control">Control 3</div> Then I created sortables using jQueryUI: $('.one').sortable({ items: 'div.control', placeholder: 'placeholder', forcePlaceholderSize: true }); Now when I'm trying to drag "Subcontrol 8" and place it between "Subcontrol 2" and "Subcontrol 3" for example I'm getting jumpy effect, you can observe it here: http://jsbin.com/egipu4/2 Interesting thing is - when I remove ability to drag "container" then it becomes smooth and perfect (you can see this on jsbin example below "jumpy" example, you can't drag using "Container drag area" span). I tried different "nested" plugins and techniques, google'd for a long time and the only one that worked was on this page: (StackOverflow doesn't allow me to post more than one like, google for "Brian Swartzfager's Blog: Nested List Sort Demo" should be first, sorry!) But it does work great only in jQuery1.2 and very old jQueryUI. If I include latest jQuery (1.3/1.4) and UI (1.7/1.8) it gets jumpy as well. What am I doing wrong?

  Read the article

• JQuery - Ajax saving sortables in connected lists when sortable item is moved

  - by Ben Sinclair

  I have multiple JQuery sortable lists that connect with each other... They allow you to assign users to certain roles. Basically what I want to do is when a user is dragged from one list to another, I want JQuery to pick up the first list that the user was moved from so that I can send an AJAX request to delete it from that list in my database. I tried the following but every time you move the user over a list and haven't even dropped it within a list, it sends this request which means I'll be sending multiple AJAX requests... Does that make sense? $( ".selector" ).sortable({ out: function(event, ui) { ... } }); From my testing, I can use the following code to just update the list that user has been moved to so I've got the second half covered: $( ".selector" ).sortable({ receive: function(event, ui) { ... } }); Hopefully I am making sense :)

  Read the article

• Dragged div change places with destination

  - by Cudos

  Hi. Maybe a bit complex to explain. I have a grid with 9 images 100 x 100 px like this (each number symbolize a picture): 1 2 3 4 5 6 7 8 9 What I want is that the user can drag and drop e.g. 9 over 1 and they change places like this: 9 2 3 4 5 6 7 8 1 Sortables from jquery UI will not work since their solution is using floats. That will "push" all the boxes to the right or left e.g.: 9 1 2 3 4 5 6 7 8 thanks in advance.

  Read the article

• Coldfusion - taking a Serialized String and converting it to a Structure

  - by nobosh

  I have the following serialized string from a nested sortable list: ul[0][id]=main1&ul[0][children][0][id]=child2&ul[0][children][0][class]=&ul[1][id]=main3&ul[2][id]=main4&ul[3][id]=main5 I want to be able to record this in the database, and think I need a structure to do this. What's the best way to turn this into a structure, so I can sort it in the database, and easily render the list on the page in the future. Thanks,B

  Read the article

• Can you explain this odd behavior with dragging items into nested sortables?

  - by RDL

  I have the following setup: A sortable list where one of the <li> has a table with lists in each cell. All of the lists are sortable with each other. Draggable items that can be added to any of the sortables Issue: When adding a draggable item ('drag 1', 'drag 2', 'drag 3') to one of the lists in the horizontal lists (table of lists) it duplicates the draggable when dropped. Sometimes it will create both copies in the same list or one in the item list and one in the column list. Here is a demo: http://jsfiddle.net/MQTgA/ Question: How do I prevent the second item being created when dropping the draggable?

  Read the article

• Animated transitions for jQuery UI's sortable

  - by Heilemann

  Just out of curiosity, as I haven't been able to find anything anywhere; does anyone know of a way to get jQuery UI's sortable function to animate its sorting? What I mean is, when you move an element around the sortable parent, its children, the sortables, skip around instead of smoothly animating to their new position, which besides from being an eyesore can also make it a bit difficult to figure out what has moved where. There's obviously no default option for this, but I was hoping that perhaps someone, somewhere, had a neat solution.

  Read the article

• jquery-ui - position of a list item when starting drag and drop?

  - by user246114

  Hi, I am using the jquery-ui library. I have two sortables. I want to know the index of the dragged source item. I have something like this: $(function() { $("#sortable1, #sortable2").sortable({ connectWith: '.connectedSortable' }).disableSelection(); $("#sortable1").sortable({ start: function(event, ui) { alert(ui.position); } }); }); if I'm reading the docs correctly, then ui.position should be what I want?: ui.position - current position of the helper but when I jsut try printing it: alert(ui.position) it seems to be empty. I am doing all of this in an attempt to emulate cloning. docs: http://jqueryui.com/demos/sortable/#event-activate Thanks

  Read the article

• Jquery UI in IE10

  - by Coelho

  I have this code on my system, and it works very well in all "real browsers", but now I need put this working on IE10. Because this development is inside a CMS I can't do upgrade on Jquery or UI. The $ version is 1.3.2 an UI version is 1.7.3. In IE I don't receive any message of error. And the Items with a class = "container myDevelopment" aren't sortables. Some one know what it's doesn't work? $(".container.myDevelopment").sortable({ connectWith: ".container.myDevelopment", receive: function (event, ui) { var issuecode = ui.item.attr("id"); var issueStatus = this.getAttribute("data-status"); alert("it's works"); } }).disableSelection();

  Read the article

• How do I keep child elements together with parent jQuery sortable.

  - by unknowndomain

  I have a list of items like this... <ol> <li> <span></span> <img src="image.png" /> <p>Image Caption</p> </li> </ol> And I want to be able to sort the LI's but not the sub elements, they should just move with their parent. I am using the jQuery to do that... $('ol li').sortable({ 'cursor': 'move' }); And its working but not moving the whole lot just the element you clicked i.e. the <p>, <img> or <span> I can't figure out how to solve this so I looked about and found an option called 'items': '> li' which was recommended but upon using this nothing drags any more but using firebug + jquery plugin I can see there is a sortable on the <li> still. Not sure what to do, example here: http://clareshilland.unknowndomain.co.uk/ Press ctrl+l to login. Enter the login details: Username: clarePassword: demo Select 'edit' from under then 'image' portion of the menu. The sortables should be those polaroids. Thanks in advance, another one I've been banging my head on the table with.

  Read the article

• jquery - array problem help pls.

  - by russp

  Sorry folks, I really need help with posting an array problem. I would imaging it's quite simple, but beyond me. I have this JQuery function (using sortables) $(function() { $("#col1, #col2, #col3, #col4").sortable({ connectWith: '.column', items: '.portlet:not(.ui-state-disabled)', stop : function () { serial_1 = $('#col1').sortable('serialize'); serial_2 = $('#col2').sortable('serialize'); serial_3 = $('#col3').sortable('serialize'); serial_4 = $('#col4').sortable('serialize'); } }); }); Now I can post it to a database like this, and I can loop this ajax through all 4 "serials" $.ajax({ url: "test.php", type: "post", data: serial_1, error: function(){ alert(testit); } }); But that is not what I want to do as it creates 4 rows in the DB table. I want/need to create a single "nested array" from the 4 serials so that it enters the DB as 1 (one) row. My "base" database data looks like this: a:4:{s:4:"col1";a:3:{i:1;s:6:"forums";i:2;s:4:"chat";i:3;s:5:"blogs";}s:4:"col2";a:2:{i:1;s:5:"pages";i:2;s:7:"members";}s:4:"col3";a:2:{i:1;s:9:"galleries";i:2;s:4:"shop";}s:4:"col4";a:1:{i:1;s:4:"news";}} Therefore the JQuery array should "replicate" and create it (obviously will change on sorting) Help please thanks in advance

  Read the article

1