Firebug: TypeError: 'click' called on an object that does not implement interface HTMLElement

Question

I get this Error when I click the button with the ID "#123" - I don't know what's the reason for this.

Code in my PHP File:

$("#123").click(function(){
    getCheckedValues('oberpunkte', 'input:checkbox[class=oberpunkte]:checked', 'input[type=textfield]');
    getCheckedValues('unterpunkte', 'input:checkbox[class=unterpunkte]:checked', 'input[type=textfield]');
    ajaxCheckedValues('POST', 'selected.php', '#sumadd');
});

My JS Functions for the Code above:

function getCheckedValues(arrayname, selector, nextselector){
    var array = arrayname;
    array = new Array();
    $(selector).each(function(){
        array.push($(this).next(nextselector).val());
    });
}

function ajaxCheckedValues(type, url, div){

    var kategorie = ($("input:radio:checked[name='kategorie']").attr('class'));

    $.ajax({
        type: type,
        url: url,
        data: { oberpunkte : oberpunkte, unterpunkte : unterpunkte, kategorie : kategorie },
        success: function (data)
                               {
                                console.log(data);
                                $(div).html(data);
                               }
          });
 }

Firebug Error:

enter image description here

I also alerted "kategorie" - it's not null. Any ideas?

HTML/PHP of Button and DIV:

echo("<input type='button' name='test' id='123' value='Checklist speichern'/>");

echo("<div id='sumadd' value=''></div>");

EDIT NOTE: Added HTML/PHP

I added the button and the div - where the JS function should fill — Preprocezzor, Feb 25 '14 at 13:03
Try commenting out functions in click event and see which function is causing this issue, what seems to me is `ajaxCheckedValues('POST', 'selected.php', '#sumadd');` — Jai, Feb 25 '14 at 13:12
It's this function. I alerted the kategorie value and it worked. Probably there is something wrong with my Ajax Post Method... I have many Ajax Calls in my Project and this one is actually similar to the others who are working great. — Preprocezzor, Feb 25 '14 at 13:31

score 3 · Accepted Answer · edited May 23 '17 at 11:57

3

I guess that problem is because you were getting undefined on oberpunkte and unterpunkte in ajax call. Try this

$("#Button123").click(function(){
  var  oberpunkte=[], unterpunkte=[];
 getCheckedValues(oberpunkte, 'input:checkbox[class=oberpunkte]:checked', 'input[type=textfield]');
    getCheckedValues(unterpunkte, 'input:checkbox[class=unterpunkte]:checked', 'input[type=textfield]');
    ajaxCheckedValues('POST', 'selected.php', '#sumadd',oberpunkte,unterpunkte);
});


function getCheckedValues(array, selector, nextselector){
    $(selector).each(function(){
        array.push($(this).next(nextselector).val());
    });
}


function ajaxCheckedValues(type, url, div,oberpunkte,unterpunkte){

    var kategorie = ($("input:radio:checked[name='kategorie']").attr('class'));

    $.ajax({
        type: type,
        url: url,
        data: { oberpunkte : oberpunkte, unterpunkte : unterpunkte, kategorie : kategorie },
        success: function (data)
                               {
                                console.log(data);
                                $(div).html(data);
                               }
          });
 }

Also change the id of input field. Id must start with alphabet .
Check What are valid values for the id attribute in HTML?

edited May 23 '17 at 11:57

Community

1
1

answered Feb 25 '14 at 13:05

Sudhanshu Yadav

2,193
16
18

are you putting js code through php? If yes can you share that part – Sudhanshu Yadav Feb 25 '14 at 13:11
The problem also may be because $ being interpreted as php variable if not done echo properly – Sudhanshu Yadav Feb 25 '14 at 13:12
No, it's between script tags. I also included JQuery. – Preprocezzor Feb 25 '14 at 13:15
Just inspect element and see weather that part of script is proper or not – Sudhanshu Yadav Feb 25 '14 at 13:17
1

Try updated answer . I guess that problem was because you were getting undefined on oberpunkte and unterpunkte in ajax call. – Sudhanshu Yadav Feb 25 '14 at 13:34
AWESOME. This worked for me! I shouldn't use strings. Thank you so much Sudhanshu Yadav! – Preprocezzor Feb 25 '14 at 13:44
Passing string to form a array was one issue plus, there was no scope of those variables on ajaxCheckedValues function – Sudhanshu Yadav Feb 25 '14 at 13:47

Firebug: TypeError: 'click' called on an object that does not implement interface HTMLElement

1 Answers1