TypeError: 'stepUp' called on an object that does not implement interface HTMLInputElement

Question

I have an error in my use of AJAX:

TypeError: 'stepUp' called on an object that does not implement interface HTMLInputElement....plete",[C,p]),--x.active||x.event.trigger("ajaxStop")))}return C},getJSON:functi...

Here is the parts of my code where I use it:

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>

It is my javascript code that works on checkboxes where I defined them before:

function feedback() {
    var boxes = document.getElementsByClassName('box');
    for (var j = 0; j < boxes.length; j++) {
        if (boxes[j].checked) {
            //assign(1);
            assign = 1;
        } else {
            assign = 0;
            //assign(0);
        }
        var wordid = document.getElementsByClassName('wordId')[j];
        $.ajax({
            url: "assigner.php",
            type: "POST",
            data: {
                wordid: wordid,
                assign: assign
            }
        }).done(function(e) {
            /*alert( "word was saved" + e );*/
        });
    }
}

I tried this but it doesn't work and it doesn't give me any errors.

var newvalue = '';
$('input[name=wordid\\[\\]]').each(function(index, element) {
    newvalue = newvalue + this.value + ',';
});
$.ajax({
    url: "assigner.php",
    type: "POST",
    data: {
        wordid: newvalue,
        assign: assign
    }
}).done(function(e) {
    /*alert( "word was saved" + e );*/
});

Answer 1

$.ajax is not expecting a DOMElement of type HTMLInputElement in the object you are passing to data. Try just giving it the value of the field instead:

var wordid = $('.wordId').val();
$.ajax({
    url: "assigner.php",
    type: "POST",
    data: { wordid: wordid, assign: assign}
}).done(function( e ) {
    /*alert( "word was saved" + e );*/
});