未捕获的TypeError：非法调用

Question

I am trying to delete users from my database using Ajax, Servlet and HTML. when I submit data Illegal Invocation occurs. I think that there won't be any problems with connection or SQL statement

delete.html

<input type="text" id="delete">
<input type="submit" onclick="deleteUSer()" value="Delete">

delete.js

function deleteUSer(){

        var username = document.getElementById("delete");

        var params = {

            username: username
        }

    $.post("Delete", params, function(data){}
            )

}

Delete.java servlet

protected void processRequest(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        PrintWriter out = null;
        DBUtils dbutils = null;
        Connection conn = null;
        try{

            String username = request.getParameter("username");

            dbutils = new DerbyUtils();
            conn = dbutils.getConnection();

            DeleteDAO dao = new DeleteDAO(conn);

            dao.deleteUser(username);



            RequestDispatcher dispatcher =
            getServletContext().getRequestDispatcher("/index.html");
            dispatcher.forward(request, response);



        }

DeleteDAO.java

public void deleteUser(String username) throws SQLException{
      try{


          String sql = "delete from users where username='"+username+"'";

          PreparedStatement ps = this.conn.prepareStatement(sql);

          ps.executeQuery();

Answer 1

you are sending html doc elemect not username ...

try this --

<input type="text" id="delete" value="vivek">
<input type="submit" onclick="deleteUSer()" value="Delete">


    function deleteUSer(){

            var username = document.getElementById("delete");

            var params = {

                username: username.value
            }

        $.post("Delete", params, function(data){}
                )

    } 

Answer 2

If you're trying to enact the "delete" command that you can use with HTTP requests, you're going to want to use $.ajax , not $.post .

To quote the docs ( https://api.jquery.com/jQuery.post/ ):

This is a shorthand Ajax function, which is equivalent to:

$.ajax({
  type: "POST",
  url: url,
  data: data,
  success: success,
  dataType: dataType
});

if you're trying to enact the "delete", you'd want to do something like:

var dataObj = {
        'username': document.getElementById("delete").value;
    }
$.ajax({
    type:"DELETE",
    data: dataObj,
    url: 'url/to/your/servlet'
});

You may also want to include a datatype in there but for this example jquery can figure it out.