We Keep Coding

Can only have one anonymous define call per script file

I'm creating monaco editor using loader.js but getting the error "Can only have one anonymous define call per script file" 2 times in console.
<script src="/monaco-editor/min/vs/loader.js"></script>
Code to create editor
require.config({ paths: { 'vs': '/monaco-editor/min/vs' }});
require(['vs/editor/editor.main'], function() {
monacoEditor= monaco.editor.create(document.getElementById('coding-editor'), {
value: [
'function x() {',
'\tconsole.log("Hello world!");',
'}'
].join('\n'),
language: 'javascript'
});
});
I tried to search the issue and found below related answer:
Some piece of code that you are loading is invoking define with an anonymous module id. You could:
load that code through the AMD loader (i.e. manually require it) such that the AMD loader creates the <script> tag.
load that code before the AMD loader (i.e. define will not be available to that piece of code)
unset define for the duration of evaluation of that script (i.e. if you load it with a <script> tag, then unset define before and restore it afterwards)
try to unset define.jquery, AFAIK jquery might be checking for that on the define function
This page has lot of jquery already and I understand this because of jQuery. Please help some to make me understood by example. Thanks

I had the same issue this morning and I applied the second solution.
load that code before the AMD loader (i.e. define will not be available to that piece of code)
This works because define is being called from inside jQuery anonymously, as the error says. Explained further in the require.js website, which happens to use loader function (define, require) similar to loader.js.
In my case I simply made sure to include my loader after jQuery so the defines don't collide.

I had tried to create script by tags, but got aler:'Can only have one anonymous define'
So I just overwrite it :
this.temp_define = window['define'];
head.appendChild(loaders);
window['define'] = undefined;

How to load new editorConfig for inline editor at run-time? [duplicate]

This question already has an answer here:
How to use CKEDITOR.replace after CKEDITOR.inline
(1 answer)
Closed 5 years ago.
I have run the Toolbar Configurator to remove some unwanted items from the toolbar. I can get the toolbar config, which consists of some javascript code which starts like this:
CKEDITOR.editorConfig = function( config ) {
config.toolbarGroups = [
However, it is unclear to me how to use this when instantiating a specific editor instead of using it globally. I have tried pasting this in my code before I instantiate the editor in question, but it shows the full toolbar with the unwanted items. I am also making some other CKEDITOR.config and CKEDITOR.on assignments at this time which do work.
I also tried modifying the configuration code within the function by changing the config to editor.config (where editor comes from the "editor" field of the event passed to the callback) and initializing it in the callback of CKEDITOR.on("instanceReady") but that also did not work.
Then I saw this question and tried using the replace function like so:
CKEDITOR.on("instanceReady", function(evt) {
...
CKEDITOR.replace(evt.editor.name, {
toolbarGroups: [
...
],
removeButtons: "..."
})
...
This also doesn't work!
Then I tried pasting the raw config from the configurator into a new file "config2.js" in my ckeditor directory on the server as this page suggests should work, and changing the replace call to:
CKEDITOR.replace(evt.editor.name, {
customConfig: "config2.js"
})
This doesn't work, even if I replace the string with "../ckeditor/config2.js". Looking at the network requests I see it doesn't even try requesting "config2.js" from anywhere.
If it makes any difference, I am starting the editor using CKEDITOR.inline(div) so as far as I know I have to perform the configuration in an event callback.
I also tried calling the replace function from the "instanceCreated" callback - this resulted in an infinite loop / max recursion exceeded error. I also tried it in the "instanceLoaded" event, also without effect.
Update:
I just noticed in the console that when it tries to call replace it throws this error:
Uncaught The editor instance "note1681" is already attached to the provided element.
So it seems I am doing something incorrectly with replace.

I believe it's impossible to hide buttons(change toolbar) after you initialized instance. However, you can recreate you ckeditor with new toolbar.
First, you need to destroy current instance, before creating new one.
CKEDITOR.instances.note1681.destroy();
CKEDITOR.replace('note1681');
For fast switching toolbar, i recommend use custom variable in configuration file.
Add in ckeditor/config.js your toolbar version
editor.my_toolbar = [['Sourcedialog','Cut','Copy']];
Init ckeditor with it
CKEDITOR.replace( 'note1681', { toolbar: my_toolbar })

Very weird jQuery error

So I had code that was working properly on my site:
$("#usr").load("somepage.php",{var1:var1,var2:var2});
But ever since I changed some code in the navigation bar, jQuery has been acting really strangely. The first major problem was that this line:
var w = $(window).width();
returns the error: object [global] has no method "width()"
And that didn't seem to matter, as all elements on the page functioned with that error (as if it was still being executed, because elements were still being placed)...but then I came to the page that implemented the first line of code, and I ran into the following error:
Cannot call method "load()" of null
Sure enough, I checked the console, and $("#usr") returns null, but I can see the HTML line in the page with the inline id of usr.
This causes a problem because I need to load data from that page for the page to function properly. But it gets even stranger. I thought I would just try a plain post request and take the data and use document.getElementById("usr").innerHTML = ... as a substitute, but I get the following error from this line:
$.post("somepage.php",{var1:var1,var2:var2},function(data){
document.getElementById("usr").innerHTML = data;
});
Error:
Uncaught TypeError: Object function $(el){if(!el)return null;if(el.htmlElement)return Garbage.collect(el);if([window,document].contains(el))return el;var type=$type(el);if(type=='string'){el=document.getElementById(el);type=(el)?'element':false}if(type!='element')return null;if(el.htmlElement)return Garbage.collect(el);if(['object','embed'].contains(el.tagName.toLowerCase()))return el;$extend(el,Element.prototype);el.htmlElement=function(){};return Garbage.collect(el)} has no method 'post'
What the heck is going on with jQuery?
I'm importing 1.8.2 from googleapis

That sounds a lot like you're loading Prototype or MooTools or something as well as jQuery, and so Prototype/MooTools/whatever is taking over the $ symbol.
If that's what's going on, and you need the other library, you can use jQuery.noConflict(). Then you either use the symbol jQuery instead of $ for your jQuery stuff, or you put all of your jQuery code into a function that you pass into jQuery.noConflict and accept $ as an argument, like so:
// Out here, $ !== jQuery
jQuery.noConflict(function($) {
// In here, $ === jQuery
});
Or you can just do it yourself:
// Out here, $ !== jQuery
jQuery.noConflict();
(function($) {
// In here, $ === jQuery
})(jQuery);
ready also passes the jQuery object into the function, if you're already using ready.

Can I void all JavaScript calls to $

I need some scripts inside an existing site's scripts.js.
This site has been online for ages, and I can not touch the scripts file.
I am including it standardly in another page. There are numerous jQuery calls in the scripts file. The place I include it does not have jQuery.
I want to void all $() type things. I tried this...
$ = function() { };
before I included scripts.js and it didn't seem to work. I am still getting errors like
$(document) is undefined
Is there a way to void all these jQuery calls?
Thanks

Even if you do get that working, you'll still have problems because the code was written with the assumption that jQuery was present. Yes, you can avoid $ is null or not defined errors on lines like this:
$('div.foo');
But there's no point in just writing that line: there will always be actions on the returned object:
$('div.foo').html('blah');
After the NOP jQuery function, you'll get a "html" is not a function error, and so on. The only way you could do it would be to fill out a skeleton of every possible jQuery method, making sure each one returns itself when appropriate.
...or just rewrite it properly...

try
window.$ = function(selector, context) {alert('eating the calls to $');}
in your file that you're including before the scripts.js file. This is how it's defined in jquery so should take care of the selector syntax.
You may need to define other overrides to cater for the $.method() type calls tho

Well, it's no surprise that $(document) is undefined, since you're not returning a value from your placeholder function. Thus, things like $(document).ready(function(){}); will naturally be errors.
Basically, if I understand right, you need $ to be a function that does nothing and returns another object where calling any member function does nothing. Further, calling member functions of $ itself (e.g. $.ajax()) should have the same behavior.
You can do this with __noSuchMethod__, which is unfortunately non-standard:
window.$ = function()
{
var doNothingObj = new (function()
{
this.__noSuchMethod__ = function()
{
return doNothingObj;
}
})();
return doNothingObj;
};
window.$.__noSuchMethod__ = window.$;
This will allow arbitrary chains:
$(document).ready(function(){});
$("#foo").animate().animate();
$.ajax({ url: "file.html"});
etc.
Of course, a much saner solution is to refactor the code that uses jQuery.

jquery element not defined, but it used to skip it

I recently transferred a site to a new host. Reloaded everything, and the javascript that worked fine before is breaking at an element it can't find. $('#emailForm') is not defined.
Now, the #emailform isn't on the page, but it wasn't before either, and JS used to skip this and it would just work. Not sure why this is happening. Any clues
Here is the site I am having the prblem:
http://rosecomm.com/26/gearwrench/

jQuery will return an empty jQuery object from $('#emailForm') if there isn't an element with the id='emailForm'.
One of the following is likely true:
You forgot to include jQuery - therefore $ is undefined.
There is another library included that uses $ - in which case you can wrap your code in a quick closure to rename jQuery to $
The Closure:
(function($){
// $ is jQuery
$('#emailForm').whatever();
})(jQuery);
You could console.log(window.$,window.jQuery); in firebug to check for both of these problems.

You have mootools-1.2.2-core-yc.js installed as well, and it is conflicting with jQuery.
http://docs.jquery.com/Using_jQuery_with_Other_Libraries
$(document).ready(function() {
(function($){
// bind 'myForm' and provide a simple callback function
$('#emailForm').ajaxForm(function() {
var txt=document.getElementById("formReturn")
txt.innerHTML="<p>Thank You</p>";
});
...
$(document).ready is being called against the moo tools library instead of jQuery.

I'm not sure why it would be skipped before, but to avoid the error, wrap the statement(s) that reference $('#emailForm') in an if statement that checks to see if it is present:
if ( $('#emailForm').length ) {
// code to handle $('#emailForm') goes here...
}