“Object doesn't support property or method 'ready'” - jquery-plugins

Object doesn't support property or method 'ready'
I am getting this error while using custom dropdown list with js mootools slider. I have downloaded js slider and custom dropdown and while trying to merge it, I am facing this error.
I have downloaded the js slider plugin from here:
http://landofcoder.com/index.php?option=com_jdownloads&Itemid=372&task=view.download&cid=6
Can anyone tell me what's wrong with it ?

Make sure what you have mootool and jquery required. You can open Inspector in Google Chrome and type in console tab MooTools and jQuery.
This libraries has conflict on global variable $.
document.id('element_id') // Mootools' "$"
jQuery('selector or something') // jQuery's "$"
I hope in you situation this should help
jQuery(document).ready(function() {
// initialize you code
});

Related

Trying to disable remove on a per file-pond item basis

I'm investigating adding custom functionality via my own plugins, and here's what I've done so far
Premise
Create a plugin which will disable the remove button for relevant items
Attempted so far
Registered a plugin and during DID_LOAD_ITEM tried the below
const removeItemButtons = el.querySelectorAll('.filepond--action-remove-item');
removeItemButtons.forEach(removeItemButton => {
removeItemButton.setAttribute("disabled", "disabled");
});
But the button is not disabled. The attribute does not appear on the remove button. Am I missing something in the lifecycle on how plugins interact with the DOM? The button does get returned by the querySelector all, is it modified after the plugin is called?
did the removeItemButtons have been rendered before your function? it seems like your selector did not get the items

Modernizr.videoautoplay object shows true, Modernizr.videoautoplay returning undefined

I'm using a custom Modernizr build, v3.3.0. I've created a simple JSFiddle example to illustrate: https://jsfiddle.net/cqkg7x45/6/.
console.log(Modernizr);
will show the Modernizr object, and when I inspect it in the JS console I can see "videoautoplay" is a property with a value of "true".
But, when I do
console.log(Modernizr.videoautoplay)
it returns "undefined".
I was originally seeing this issue in a WordPress theme I'm developing, but was also able to recreate in JSFiddle and a separate stand-alone HTML page. Also, Modernizr is putting the "videoautoplay" class on my HTML tag, even when I know the device does not support that feature (iPhone 5).
Update: This issue appears to be happening in Chrome (v47.0.2526.106), but not Firefox (v43.0.2).
I'm going to answer my own question in case anyone else runs into this problem. I found the solution on this SO post: How do I detect if the HTML5 autoplay attribute is supported?.
Since this is an "async" test you can't access the property using the syntax
Modernizr.videoautoplay
You have to use the .on() function, as shown in the above SO post:
Modernizr.on('videoautoplay', function(result){
if(result) {
alert('video autoplay is supported');
} else {
alert('video autplay is NOT supported');
}
});

Clean up DOM after a Firefox add-on SDK extension Disable/Remove action is fired

I am working on a add-on SDK extension which uses a pageMod object with a content script that adds a DIV tag to the DOM (this tag behaves like a button) when the action button is being clicked.
I am trying to find a solution where I can delete that newly added DOM element when the extension is being disabled or removed and I've had no luck so far.
The first thing that I've tried was to use the AddonManager.addAddonListener(listener) approach where I would listen for a onUninstalling or a onDisabling event and then communicate with the content script but I got nowhere.
What I've tried next was to make use of the exports.onUnload solution where I tried to send a message from the pageMod's worker to the content script and deal with the removal of the DIV from there but it seems that the content script is no longer responsive by the time the onUnload function is being triggered.
Is there really no way to clean up the modified DOM when the extension is being disabled/removed?
At your content script listen for the detach event.
self.on("detach", function(reason){
//remove that div
});
In #paa's answer the "port" part is missing:
e.g., from the docs
var oldInnerHTML = window.document.body.innerHTML;
window.document.body.innerHTML = "eaten!";
self.port.on("detach", function() {
window.document.body.innerHTML = oldInnerHTML;
});
I am not using PageMod nd this works for me.

Firefox add-on: Injected HTML

I'm trying to write an add-on for firefox and i'm having a problem-
When the user right-clicking on the page the add-on is adding an element to the page's body using
document.body.appendChild(myElement);
myElement has a button and i want that "onClick" it will call a xmlHttpRequest and handle the response in some why. I've tried to inject the two scripts using
document.getElementsByTagName('head')[0].appendChild(xmlRequestFunction);
document.getElementsByTagName('head')[0].appendChild(handleResponseFunction);
but it didn't work because of (i assume) a security problem.
What can i do?
Thanks
Do not use onclick when working with content, use addEventListener instead (see https://developer.mozilla.org/en/XPCNativeWrapper#Limitations_of_XPCNativeWrapper if you need to know why). Like this:
myElement.addEventListener("click", function(event)
{
var request = new XMLHttpRequest();
...
}, false);

Internet Explorer Error

The main error shown in IE is : ' Could not complete the operation due to error 80020101.'
The error is displayed when the ExtJS framework tries to load a page containing a Ext grid component through an ajax request.
It works without problems in Firefox and Chrome.
Another error which is shown by IE is 'Expected identifier, string or number' which points to the line containing HTML inline style definition which is perfectly valid. I am not sure why this error is shown. I feel IE is pointing this error to the wrong place.
Could anyone please help me out on this?
"Could not complete the operation" errors in IE are usually caused by trying to modify the DOM before it is ready.
Move the JS so it fires in (for example) the onload event, or a JS library's ondomready event.
If you are loading a page using ajax and it has a inline script file like below add // before
the open comment tag
<script type="text/javascript">
// <!--
alert('text');
// -->
</script>
http://dracoblue.net/dev/could-not-complete-the-operation-due-to-error-80020101/137/

Resources