This issue is occurring when my page loads.

Using the following scripts -jquery.simplemodal-1.4.3.js-jquery v1.7.1

Below is a small code snap, of the code inside simplemodal where this error is occuring.

 focus: function (pos) { var s = this, p = pos && $.inArray(pos, ['first', 'last']) !== -1 ? pos : 'first';// focus on dialog or the first visible/enabled input elementvar input = $(':input:enabled:visible:' + p, s.d.wrap);setTimeout(function () {input.length > 0 ? input.focus() : s.d.wrap.focus();}, 10);},

Any Ideas that i could do to resolve this would be great

2

Best Answer


This is an old question and the original poster has probably resolved his concrete issue.
But the general questions related to the Error Messages:

  • Uncaught TypeError: Cannot read property '...' of undefined
  • Uncaught TypeError: Cannot read property '...' of null
    and
  • Uncaught TypeError: Cannot set property '...' of undefined
  • Uncaught TypeError: Cannot set property '...' of null

are still important for many peoples and have a simple and general answer:

The object of that we try to read property, set property or call a function
- is not declared or
- is declared, but not defined or
- is null

Simple test code in Google Chrome

<script type="text/javascript">// object obj is not declared, there is no previos 'var obj;'obj.prop; // Uncaught TypeError: Cannot read property 'prop' of undefinedobj.prop = "value1"; // Uncaught TypeError: Cannot set property 'prop' of undefinedobj.func(); // Uncaught TypeError: Cannot read property 'func' of undefined// ------------------------------------------------------------------------// object 'obj' is declared with:var obj;// but it is not defined, there is no value assigned to it (obj = 5 or something else)obj.prop; // Uncaught TypeError: Cannot read property 'prop' of undefinedobj.prop = "value1"; // Uncaught TypeError: Cannot set property 'prop' of undefinedobj.func(); // Uncaught TypeError: Cannot read property 'func' of undefined// ------------------------------------------------------------------------// object 'obj' is declared and defined. Value is nullvar obj = null;obj.prop; // Uncaught TypeError: Cannot read property 'prop' of nullobj.prop = "value1"; // Uncaught TypeError: Cannot set property 'prop' of nullobj.func(); // Uncaught TypeError: Cannot read property 'func' of null// ------------------------------------------------------------------------// object 'obj' is declared and definedvar obj = {prop: "propertyValue", func: function() {return "returnValue"}}// there are no errors</script>

The same code in Firefox:

// object obj is not declared, there is no previos 'var obj;'obj.prop; // Uncaught TypeError: obj is undefinedobj.prop = "value1"; // Uncaught TypeError: obj is undefinedobj.func(); // Uncaught TypeError: obj is undefined-----------------------------------// object 'obj' is declared with:var obj;// but it is not defined, there is no value assigned to it (obj = 5 or something else)obj.prop; // Uncaught TypeError: obj is undefinedobj.prop = "value1"; // Uncaught TypeError: obj is undefinedobj.func(); // Uncaught TypeError: obj is undefined-----------------------------------// object 'obj' is declared and defined. Value is nullvar obj = null;obj.prop; // Uncaught TypeError: obj is nullobj.prop = "value1"; // Uncaught TypeError: obj is nullobj.func(); // Uncaught TypeError: obj is null-----------------------------------// object 'obj' is declared and definedvar obj = {prop: "propertyValue", func: function() {return "returnValue"}}// there are no errors

So there are some differences in the Error Message between browser, but the massage is clear:

The object in not defined or null.

In the general case it is easy to understand what exactly the error message means.

But why this happens in concrete cases?

The reasons could by many, but the important ones could be:

  • Calling a function or accessing a property

    • before it is initialized/defined
      These could happen, if an object (popup, modal), created on the fly, is not ready yet.
    • after it is destroyed
  • Structure changes by using new versions of an API, where a property or function was

    • renamed or
    • moved to other objects
  • By using loops on arrays: the index don't exist, because of

    • bad incrementation/decrementation or
    • bad condition

How to debug?

  • Find on which object and where the error is thrown
  • Read the documentation to assure that,
    • try using the object on the right place,
    • have called all needed functions, before using the object
  • Look in the scope/function if the object is defined,
  • If not, look in the stacktrace in its caller(s)...

When encountering the error 'cannot read property takefocus of undefined' in JavaScript, it means that you are trying to access the 'takefocus' property of an object that is undefined. This error typically occurs when you are trying to access a property of an object that does not exist.

To fix this error, you need to ensure that the object you are trying to access the 'takefocus' property of is defined. You can do this by checking if the object exists before accessing its properties. One way to do this is by using conditional statements such as 'if' or 'ternary' operators to check for the existence of the object.

For example:

if (obj && obj.takefocus) {
// Access 'takefocus' property
} else {
// Handle case when object is undefined
}

In the above code snippet, we first check if the 'obj' exists and then access its 'takefocus' property. If the object is undefined, we can handle the error in the 'else' block.

By ensuring that the object is defined before accessing its properties, you can prevent the 'cannot read property takefocus of undefined' error from occurring in your JavaScript code.