Draggable/Sortable nesting issue (error in onDragStart) - javascript

I'd like to both drag the row of items as well as the items itself, within the same or across different rows. It works until I try to move the last item of a row which then results in an error.
jsfiddle:
https://jsfiddle.net/lexixon/nf97erqx/64/
Error:
Uncaught TypeError: Cannot read property 'element' of null
at VueComponent.onDragStart (vuedraggable.js:380)
at mt.<anonymous> (vuedraggable.js:37)
at Ct (Sortable.min.js:3)
at mt._dragStarted (Sortable.min.js:3)
Uncaught TypeError: Cannot read property 'index' of null
at VueComponent.onDragRemove (vuedraggable.js:403)
at mt.<anonymous> (vuedraggable.js:37)
at Ct (Sortable.min.js:3)
at mt._onDrop (Sortable.min.js:3)
at mt.handleEvent (Sortable.min.js:3)

Related

Error Cannot read property 'contains' of undefined on dropdown sidebar menu

When clicking the sidebar navigation link drop-down toggle instead of showing the drop-down list of items, I'm getting this error:
Uncaught TypeError: Cannot read property 'contains' of undefined
at sidebar.js:369
at Array.forEach (<anonymous>)
at t.n._toggleDropdown (sidebar.js:367)
at HTMLAnchorElement.<anonymous> (sidebar.js:497)
at HTMLDivElement.i (event-handler.js:116)
Checking the console the line that is generating the error is:
if (Default.dropdownAccordion === true) {
this._getAllSiblings(toggler.parentElement).forEach(element => {
if (element !== toggler.parentNode) {
if (element.classList.contains(CLASS_NAME_NAV_DROPDOWN)) { // line 369
element.classList.remove(CLASS_NAME_SHOW)
}
}
})
}
I'm using CoreUI (v3.2.0).
When I was looking for a solution I found that this could be a problem related to having different versions of the template but I have no idea how to fix it.

TypeError: null is not an object (evaluating '*')

For the below code:
var item = cartModel.getlist()[index];
if((item.isDepo()) {
// Some code
} else if(!permission.hasPermissionToVoidSKU()) {
// Some code
} else if(item.sku.indexOf(mposConstants.RESTOCK_FEE_SKU) > -1){
// Some code
}
I'm getting this error:
TypeError: null is not an object (evaluating 'item.sku.indexOf')
If item object is null, the error is something different (see below). In what scenario will this error be thrown?
Update:
If item.sku is null, the error is:
[FATAL] [] [-] ["TypeError: Cannot read property 'indexOf' of null
If item is null, the error is:
[FATAL] [] [-] ["TypeError: Cannot read property 'isDepo' of null
The reason for the different error messages is quite simply that they are produced by different browsers. The error is the same (sku on the object item is null).
Given the following code
<script>
var item = {sku: null};
item.sku.indexOf("");
</script>
here is some error messages for different browsers:
Firefox: TypeError: item.sku is null
Firefox Developer Edition: TypeError: item.sku is null, can't access property "indexOf" of it
Opera: TypeError: Cannot read property 'indexOf' of null
at example.html:3
Safari: TypeError: null is not an object (evaluating 'item.sku.indexOf')
To get the error message you have gotten, item must be defined as an object, and sku must be set to null. If sku were undefined, you would have gotten an error message like this (Safari): TypeError: undefined is not an object (evaluating 'item.sku.indexOf'). If item was null, you would have gotten something like this: TypeError: null is not an object (evaluating 'item.sku').
Based on this answer and others, it sounds like you're getting that error because a function is called before the DOM element it references or acts upon has been loaded.
In the snippet of code you provided, I don't see a direct reference to any DOM elements, but I would suggest calling your script after your HTML has finished rendering (i.e. by putting any <script> tags at the end of your HTML, or by using a $(document).ready() call if you use jQuery).

Waypoints – jQuery.Deferred exception: Cannot read property

I'm getting a bunch of errors when using Waypoints. Everything is behaving as it should, except enableAll(), despite disableAll() working as it should. The main errors are:
jQuery.Deferred exception: Cannot read property 'top' of undefined TypeError: Cannot read property 'top' of undefined
Uncaught TypeError: Cannot read property 'top' of undefined
I am building my Waypoints from an array, which is what I think is causing the problem. The array contains IDs which I am then adding a string to to create a corresponding Waypoint:
var links = ['#id1', '#id2', '#id3', '#id4'];
$(document).ready(function () {
$.each(links, function (p, linkP) {
var inview = new Waypoint.Inview({
element: $(linkP + 'Content'),
...

Trace undefined variable in JavaScript

I'm getting the following error:
libs.js:3392 TypeError: Cannot read property 'offsetHeight' of undefined
at Object.b.updateAutoHeight (http://localhost:3000/.../scripts/libs.js:1529:12362)
at Object.b.slideTo (http://localhost:3000/.../scripts/libs.js:1530:1740)
at Object.b.init (http://localhost:3000/.../scripts/libs.js:1530:25098)
at Object.t (http://localhost:3000/.../scripts/libs.js:1530:27249)
at HTMLDivElement.<anonymous> (http://localhost:3000/.../scripts/libs.js:1529:107)
at Function.each (http://localhost:3000/.../scripts/libs.js:1409:2882)
at n.each (http://localhost:3000/.../scripts/libs.js:1409:847)
at n.e.fn.swiper (http://localhost:3000/.../scripts/libs.js:1529:85)
at Carousel.activate (http://localhost:3000/.../scripts/app.js:1802:34)
at Carousel.toggleActivation (http://localhost:3000/.../scripts/app.js:1824:57)
Now I know the error is that some variable is being passed into a library, that is undefined when it isn't supposed to be. How do I backtrace the variable that is being passed that is undefined?

TypeError: 'null' is not an object

This is my Prototype / JS code:
if($('myElemId')) {
myVar = $('myElemId').checked;
}
This is the error I get in Safari: TypeError: 'null' is not an object (evaluating '$('myElemId').checked')
Why is that and why is it only coming up in Safari? Do I get it right that the selector returns null and thus the checked state cant be fetched?

Categories