Why am I getting this error Failed to execute 'createComment' on 'Document': 1 argument required, but only 0 present?, if my function is not taking in any arguments?

      <form onsubmit='createComment()' method='POST'>
var createComment = function () {

var author = $('#addCommentAuthor').val()
var email = $('#addCommentEmail').val()
var content = $('#addCommentContent').val()
var date = $('#addCommentDate').val()
$.ajax({
url: "controller.php",
type: 'POST',
data: {
  mentType: mentType,
  questionId: currentQuestionID,
  add_ment_author: author,
  add_ment_email: email,
  add_ment_content: content,
  add_ment_date: date
},
success: function(data) {
  console.log(data)
}
})
}

Why am I getting this error Failed to execute 'createComment' on 'Document': 1 argument required, but only 0 present?, if my function is not taking in any arguments?

      <form onsubmit='createComment()' method='POST'>
var createComment = function () {

var author = $('#addCommentAuthor').val()
var email = $('#addCommentEmail').val()
var content = $('#addCommentContent').val()
var date = $('#addCommentDate').val()
$.ajax({
url: "controller.php",
type: 'POST',
data: {
  mentType: mentType,
  questionId: currentQuestionID,
  add_ment_author: author,
  add_ment_email: email,
  add_ment_content: content,
  add_ment_date: date
},
success: function(data) {
  console.log(data)
}
})
}

• javascript

• 1 createComment already exists on document. When placing a function call into the onsubmit handler, it’ll actually call document.createComment. To fix this, rename your function to something else, or use the standard addEventListener. – Sebastian Simon Commented Sep 7, 2017 at 12:55
• Possible duplicate of Uncaught TypeError: lang is not a function — replace lang by createComment and it’ll be exactly the same problem (also, animate, if you follow the duplicate chain). – Sebastian Simon Commented Sep 7, 2017 at 12:57
• Isn't it erased everytime I update it? – runucegop Commented Sep 7, 2017 at 12:58
• What is erased? – Sebastian Simon Commented Sep 7, 2017 at 12:59
• I noticed that all your three questions are the same problem. – Sebastian Simon Commented Sep 7, 2017 at 13:00

1 Answer 1

I had a similar problem, in my HTML I had given a button an onclick attribute and the attributes value was a function that I had defined in my JavaScript file.

I had named my function: createElement()

<button onclick ="createElement()"> </button>

However when I clicked it, my function wasn't executing, instead was getting the error message:

index.html:28 Uncaught TypeError: 
Failed to execute 'createElement' on 'Document': 
1 argument required, but only 0 present.
    
at HTMLButtonElement.onclick

What I hadn't appreciated was that, my chosen function name was clashing with the pre-existing JS method named:

document.createElement() 

which is used like this:

document.createElement("div")

So presumably, my HTML was trying to invoke this native JS method, instead of my own

After discovering this, I simply renamed my function, and everything worked like normal again:

 <button onclick ="createEl()"> </button>