Javascript Uncaught Reference error Function is not defined

Question

Check the Fiddle to see the failure occurring.

When I add Data (Even if I leave it empty) to the text box and try to click "Add" it doesn't do anything.

Opening the Chrome and Firefox console both give me the same error, it says "changeText2()" is not defined.

How can I fix this? I've ran into this error several times and mostly it had really weird workarounds, but I am not sure as to the method for avoiding it or what I'm even doing wrong.

It seems removing the global variable declarations fixes it most of the time, however, I need them in this case and would rather know why and how this error occurs.

Javascript:

var list = document.getElementById('deliveryIdArray');
var names = [];

function changeText2() {
    var deliveryIdentification = document.getElementById('deliveryIdentification').value;
    names.push(deliveryIdentification);//simply add new name to array;
    //array changed re-render list
    renderList();
}

function renderList(){
    while (list.firstChild) {
        list.removeChild(list.firstChild);
    }
    //create each li again
    for(var i=0;i<names.length;i++){
        var entry = document.createElement('li');
        entry.appendChild(document.createTextNode(names[i]));
        var removeButton = document.createElement('button');
        removeButton.appendChild(document.createTextNode("remove"));
        removeButton.setAttribute('onClick','removeName('+i+')');
        entry.appendChild(removeButton);
        list.appendChild(entry);
    }
}


function removeName(nameindex){
    names.splice(nameindex,1);
    //array changed re-render list
    renderList();
}

function getDeliveries(){
    return names;
}

HTML:

<b>Number(s): </b>
    <input id = "deliveryIdentification" name = "deliveryIdentification" type = "text" size = "16" maxlength = "30">

    <!-- Array Area Creation -->
    <input type='button' onclick='changeText2()' value='Add' />

    <ol id="deliveryIdArray">
    </ol>

Fiddle: http://jsfiddle.net/vSHQD/

Change the wrapping in the fiddle (menu at the left) to "No wrap - in head". — Denys Séguret
– Denys Séguret, Commented May 15, 2014 at 11:15
this will helpful to you....stackoverflow.com/questions/17378199/… — chandu
– chandu, Commented May 15, 2014 at 11:20

Niet the Dark Absol · Accepted Answer · 2014-05-15 11:15:57Z

98

In JSFiddle, when you set the wrapping to "onLoad" or "onDomready", the functions you define are only defined inside that block, and cannot be accessed by outside event handlers.

Easiest fix is to change:

function something(...)

To:

window.something = function(...)

answered May 15, 2014 at 11:15

Niet the Dark Absol

326k86 gold badges480 silver badges604 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Erick Over a year ago

This works. jsfiddle.net/vSHQD/1 updated fiddle showing it working. Thank you for the fast and correct answer.

Shaunak D · Accepted Answer · 2014-05-15 11:22:50Z

5

Change the wrapping from "onload" to "No wrap - in <body>"

The function defined has a different scope.

answered May 15, 2014 at 11:22

Shaunak D

20.7k10 gold badges48 silver badges79 bronze badges

Comments

sb813322 · Accepted Answer · 2022-12-24 08:55:14Z

1

If you are using Angular.js then functions imbedded into HTML, such as onclick="function()" or onchange="function()". They will not register. You need to make the change events in javascript. Such as:

$('#exampleBtn').click(function() {
  function();
});

edited Dec 24, 2022 at 8:55

sb813322

12910 bronze badges

answered Sep 6, 2017 at 5:02

Ophiucus

1154 silver badges17 bronze badges

1 Comment

Josh Over a year ago

Worked for me. Think it's Jquery vs Javascript mistake

Collectives™ on Stack Overflow

Javascript Uncaught Reference error Function is not defined

3 Answers 3

1 Comment

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related