0

So here is the script that I have, basically what it does is toggles some checkbox images (I'm replacing checkbox with much larger images for easier clicking) on a page load.

I'm getting the error: [13:26:12.076] TypeError: can't convert undefined to object @ http://example.com/manage_account_js_snippet.js:17

Why is this? I'd clearly declared checkboxArray already as an object. So I'm not sure why it keeps throwing this error. My appologies as i'm not very good with javascript so the answer might be obvious. The page this error is from is behind a login page so I can't link to it directly sadly.

EDIT: I'm an idiot - knew I forgot something - the line that screws it up is line #17

$(document).ready(checkthemboxes());

var checkboxArray = {};

function togglecheckbox(checkboxid, forcestate)
{
  if(forcestate == "checked")
  {
    document.getElementById("checkbox_" + checkboxid).checked = true;
    document.getElementById("checked" + checkboxid).style.display = "inline";
    document.getElementById("unchecked" + checkboxid).style.display = "none";
    checkboxArray[checkboxid] = true;
  } else if (forcestate == "unchecked") {
    document.getElementById("checkbox_" + checkboxid).checked = false;
    document.getElementById("checked" + checkboxid).style.display = "none";
    document.getElementById("unchecked" + checkboxid).style.display = "inline";
    checkboxArray[checkboxid] = false;
  } else {
    if(checkboxArray[checkboxid] == 'undefined')
    {
      checkboxArray[checkboxid] = false;
    }

    if(!checkboxArray[checkboxid])
    {
      document.getElementById("checkbox_" + checkboxid).checked = true;
      document.getElementById("checked" + checkboxid).style.display = "inline";
      document.getElementById("unchecked" + checkboxid).style.display = "none";
      checkboxArray[checkboxid] = true;
    } else {
      document.getElementById("checkbox_" + checkboxid).checked = false;
      document.getElementById("checked" + checkboxid).style.display = "none";
      document.getElementById("unchecked" + checkboxid).style.display = "inline";
      checkboxArray[checkboxid] = false;
    } 
  }
}

function checkthemboxes()
{
  var cbs = document.getElementsByClassName('uncheckedcheckbox');
  var idname;
  for(var i = 0; i < cbs.length; i++) {
    if(cbs[i].type == 'checkbox') {
      idname = cbs[i].id.replace("checkbox_","");
        if(cbs[i].checked == true)
        {
            togglecheckbox(idname, "checked");
        } else {
            togglecheckbox(idname, "unchecked");
        }
    }
  }
}
Matthew 'mandatory' Bryant
  • 3,157
  • 5
  • 20
  • 29
  • 6
    Lose the parens: `$(document).ready(checkthemboxes);` You're running `checkthemboxes` *immediately* and passing the *return value* of that function to `$(document).ready`. Instead, you want to pass the *function itself* to `ready`. – apsillers Aug 21 '13 at 17:32
  • Wow, that actually fixed it - could you make a post so I can mark you as the answer? – Matthew 'mandatory' Bryant Aug 21 '13 at 17:33
  • possible duplicate of [Why does jQuery or a DOM method such as \`getElementById\` not find the element?](http://stackoverflow.com/questions/14028959/why-does-jquery-or-a-dom-method-such-as-getelementbyid-not-find-the-element) – Felix Kling Aug 21 '13 at 17:37
  • 2
    FYI, jQuery has nice documentation which explains how to properly set it up: http://learn.jquery.com/using-jquery-core/document-ready/. – Felix Kling Aug 21 '13 at 17:39

0 Answers0