Comments (20)
I was able to fix this by removing the toleranceElemenet property.
from nestedsortable.
@harsimranb - and everything still worked for you? In the documentation he states that it must be present. I'll give it a shot (unfortunately can't get to it until tomorrow)
from nestedsortable.
Yeh, it worked for me. I didn't go through the documentation, but it seems to be working fine. Give it a try.
from nestedsortable.
I gave it a try. It prevented the JavaScript error, but made the dragging/dropping positioning all out of whack. Whatever item I try to click and drag, ends up positioning itself at the top of the screen even though my mouse cursor is somewhere else.
from nestedsortable.
Interesting....I didn't have that issue. The only is I had was that when I set the maxLevels to 2, it shows the place holder for level 3, but doesn't actually put it there, just puts it back to previous level. Which is a bug IMO. I haven't gotten a chance to revisit the project, but once I do, I will definitely do more research and post my findings here.
from nestedsortable.
Hello,
a couple of clarifications on this matter:
a) the toleranceElement property is very nevessary :) otherwise it becomes virtually impossible to sort nested lists
b) the placeholder is still shown, but it is given the class mjs-nestedSortable-error. you can either style the class, for example, with a red background (like in my demo) to show something's wrong there, or give it 0 height to make it disappear
As for your error, please try with toleranceElement: '> .inner-wrap'
. Otherwise it will not find the right .inner-wrap, which is only the direct child of the li
element, and not the child of the child as well.
from nestedsortable.
@mjsarfatti - thanks for the suggestion. I tried toleranceElement: '> .inner-wrap'
But it does the same thing. With every pixel I click-and-drag, I get Uncaught TypeError: Cannot read property 'left' of null
from nestedsortable.
what html are you using?
from nestedsortable.
Here's the starting pattern of the HTML (it's really long so I'm just cutting it off).
<ul class="project-wizard">
<li class="level-1">
<div class="inner-wrap">
<input type="text" class="input-text tiny percent" />
Supply
</div>
<ul>
<li class="level-2">
<div class="inner-wrap">
<input type="text" class="input-text tiny percent" />
Macro Labor Supply Indicators
</div>
<ul>
<li class="level-4">
<div class="inner-wrap">
<input type="text" class="input-text tiny percent" />
Total Labor Force
<a href="#" class="icon delete">delete</a>
</div>
</li>
<li class="level-4">
<div class="inner-wrap">
<input type="text" class="input-text tiny percent" />
Unemployment Rate
<a href="#" class="icon delete">delete</a>
</div>
</li>
<li class="level-4">
<div class="inner-wrap">
<input type="text" class="input-text tiny percent" />
Projected Population Growth
<a href="#" class="icon delete">delete</a>
</div>
</li>
</ul>
. . .
And here's the JavaScript:
$(document).ready(function () {
$('.project-wizard').nestedSortable({
handle: '.inner-wrap',
items: 'li',
toleranceElement: '> .inner-wrap',
listType:'ul'
});
});
from nestedsortable.
Sorry, no idea what's happening. Everything looks ok to me... try a simplified version in jsbin maybe?
from nestedsortable.
Good Idea. I'll give it a try soon and give an update.
from nestedsortable.
All my CSS HTML and JS worked just fine in JS Bin. Must be another random script in my applicaiton interfering.
from nestedsortable.
@benlwilliams Did you ever figure out what the problem was? I'm currently experiencing the same issue with nearly identical HTML and completely identical JS.
from nestedsortable.
@stevenpetryk Sorry, I don't remember. I got it working on my POC, but we eventually removed this plugin because it performed to slow with the massive amount of data we were using with it.
from nestedsortable.
Hi Ben, I'm also using nestedSortable for a large number of elements. Did
you move to another plugin or write something custom? Curious of the
performance gains you were able to get if you continued with nested
sortable elements.
Cheers,
Troy
On Thu, Sep 26, 2013 at 9:59 PM, Ben Williams [email protected]:
@stevenpetryk https://github.com/stevenpetryk Sorry, I don't remember.
I got it working on my POC, but we eventually removed this plugin because
it performed to slow with the massive amount of data we were using with it.—
Reply to this email directly or view it on GitHubhttps://github.com//issues/46#issuecomment-25217746
.
from nestedsortable.
We ended up doing a less impressive custom solution.
On Thu, Sep 26, 2013 at 9:08 PM, Troy Gaylord [email protected]:
Hi Ben, I'm also using nestedSortable for a large number of elements. Did
you move to another plugin or write something custom? Curious of the
performance gains you were able to get if you continued with nested
sortable elements.Cheers,
TroyOn Thu, Sep 26, 2013 at 9:59 PM, Ben Williams [email protected]:
@stevenpetryk https://github.com/stevenpetryk Sorry, I don't
remember.
I got it working on my POC, but we eventually removed this plugin
because
it performed to slow with the massive amount of data we were using with
it.—
Reply to this email directly or view it on GitHub<
https://github.com/mjsarfatti/nestedSortable/issues/46#issuecomment-25217746>.
—
Reply to this email directly or view it on GitHubhttps://github.com//issues/46#issuecomment-25217994
.
from nestedsortable.
Ok, thanks for getting back to me.
On Fri, Sep 27, 2013 at 8:04 AM, Ben Williams [email protected]:
We ended up doing a less impressive custom solution.
On Thu, Sep 26, 2013 at 9:08 PM, Troy Gaylord [email protected]:
Hi Ben, I'm also using nestedSortable for a large number of elements.
Did
you move to another plugin or write something custom? Curious of the
performance gains you were able to get if you continued with nested
sortable elements.Cheers,
TroyOn Thu, Sep 26, 2013 at 9:59 PM, Ben Williams [email protected]:
@stevenpetryk https://github.com/stevenpetryk Sorry, I don't
remember.
I got it working on my POC, but we eventually removed this plugin
because
it performed to slow with the massive amount of data we were using
with
it.—
Reply to this email directly or view it on GitHub<https://github.com/mjsarfatti/nestedSortable/issues/46#issuecomment-25217746>
.
—
Reply to this email directly or view it on GitHub<
https://github.com/mjsarfatti/nestedSortable/issues/46#issuecomment-25217994>.
—
Reply to this email directly or view it on GitHubhttps://github.com//issues/46#issuecomment-25240372
.
from nestedsortable.
@troygaylord I was having this same issue. Turns out one of my LI's wasn't wrapped in a div (I have a plus icon to add a new list item). Check to make sure every single element has the toleranceElement inside of it.
from nestedsortable.
I started experiencing this error after I started using ZURB Foundation.
Without thinking about it, I started using Foundation's button groups inside of my nested sortable list items, which require that you mark everything up with an unordered list:
<ul class="button-group">
<li>[Edit link]</li>
<li>[Delete link]</li>
</ul>
Because I had my nested sortable configured to look for unordered lists, these "extra" unordered lists caused this Cannot read property 'left' of null
error.
# This is CoffeeScript. Do not be afraid of CoffeeScript. ;)
$('#collections-list > ul').nestedSortable
handle: '.nested-list-item-container'
listType: 'ul'
items: 'li'
opacity: 0.6
tolerance: 'pointer'
toleranceElement: '> .nested-list-item-container'
(Maybe this comment will help a frustrated Googler in the future. ;))
from nestedsortable.
Even I got the same error. I fixed it by correcting my HTML. There was one extra empty LI in my HTML, and the tolerance was toleranceElement: '> div', which was throwing the error cannot read property 'left' of null error. Hope it helps.
from nestedsortable.
Related Issues (20)
- Error returning toArray HOT 1
- does expandOnHover and startCollapsed work? HOT 2
- Multiselect possible ?
- Save position HOT 4
- Conflict with Angular
- Cannot put the first child on root
- Cannot put the first child on root
- problem with nesting HOT 9
- [enhancement] Add missing bower.json.
- Angular-NestedSortable
- Add bower/composer support HOT 1
- Incompatibility with jQuery 1.10 and jQuery UI 1.11 HOT 2
- Add item index in toArray
- Items jump up if the window is scrolled down (Please help me) HOT 1
- Uncaught TypeError: Cannot read property 'match' of undefined HOT 1
- Using Nested Sortable in WordPress Admin Sortable box HOT 1
- Relocate event uses element's IDs hardcoded HOT 2
- problem when drag item in long list.
- locked items HOT 2
- How change default rendering of plugin? How to take current information about node after drag and drop? HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from nestedsortable.