Uncaught ReferenceError: function is not defined

Question

Im doing a simple jquery function using rangy script but im not being able to get it work, it says the error above.

<div onclick="cmon('cenas');"> cenas </div>

 <textarea class="guides_chapters_textarea" id="textarea" name="gmessage" rows="7" cols="25"> Insert starting items here</textarea>

Javascript:

function cmon(text){
    $("#textarea").insertText(text, 0, "collapseToEnd");
}

Jsfiddle: http://jsfiddle.net/VmhMM/

@Quentin that doesnt solve my problem, I dont want to use onload :x I want a solution to avoid onload. — Cristiano Marques, Aug 03 '13 at 09:21
@CristianoMarques – As the duplicate question says, using onload is the reason you have your problem. If you don't want to use it, why are you using it? It is not in any way helpful to your code. — Quentin, Aug 03 '13 at 09:26

score 3 · Accepted Answer · edited Oct 01 '16 at 15:49

3

To get your example working, there is a few things you can do. Strictly speaking, there is actually nothing wrong with your code. The fault lies in how your code is being used/added to the page.

Here is one method of getting your code to work, by setting the function on the window object directly.

window.cmon = function cmon(text){
    $("#textarea").insertText(text, 0, "collapseToEnd");
}

Another method mentioned by @elclanrs in the comment on the question (which is a better option in this case) points to the setting in the left panel of the JSFiddle to do with where your function is being run. By default, it adds it to the onLoad event which makes the function out of scope as it is being defined inside the event. Here is exactly what JSFiddle did to your code:

$(window).load(function(){
    function cmon(text){
    $("#textarea").insertText(text, 0, "collapseToEnd");
    }
});

The concept that is going on is known as closures. So when you define a function, any variables or other functions defined inside of that are not accessible externally. If you set the variable on a global object or any other object outside the scope of your newly defined function (like I did in the example I linked), you can access what you defined outside of the closure.

edited Oct 01 '16 at 15:49

HarshWombat

159
2
2
8

answered Aug 03 '13 at 09:23

Turnerj

4,258
5
35
52

I'm gettint this error on my website: Uncaught TypeError: Object [object Object] has no method 'insertText' | Its not loading the rangy script right? – Cristiano Marques Aug 03 '13 at 09:36
Sounds like you're not using jQuery on your website then like the fiddle was. Might need to check that out. – Turnerj Aug 03 '13 at 09:38
its right before the script :x – Cristiano Marques Aug 03 '13 at 09:41
What's the URL of the page? – Turnerj Aug 03 '13 at 09:45
http://www.dawnsource.com/create-guide/?shap=Desecrator | press written content and then images. – Cristiano Marques Aug 03 '13 at 10:26
alert(typeof $ == "undefined"); alert(typeof jQuery == "undefined"); returns false so its loaded right? – Cristiano Marques Aug 03 '13 at 13:20
Sorry, I can't access the page as it requires a login. Yep, if those two checks you did returned false it definitely has loaded. How are you calling `insertText` exactly? Straight after a jQuery call like `$('#textarea').insertText()` like in your question here? It sounds like it isn't a jQuery object you are calling the function on. – Turnerj Aug 04 '13 at 04:39

score 0 · Answer 2 · answered Aug 03 '13 at 09:23

You must use (no wrap in head) at the left side. This means you must load this script between tags. But If you still want to use it onload then:

<div id="cmon"> cenas </div>
     <textarea class="guides_chapters_textarea" id="textarea" name="gmessage" rows="7" cols="25"> Insert starting items here</textarea>
    <script>

        $("#cmon").click(function(){
            cmon($(this).text());
        });

        function cmon(text){
            $("#textarea").insertText(text, 0, "collapseToEnd");
        }
    </script>

Here is the solution : http://jsfiddle.net/VmhMM/2/

Uncaught ReferenceError: function is not defined

2 Answers2