Error says that POST request doesn't contain a multipart/form-data or multipart/mixed stream even though I explicitly define it as such

Question

I'm trying to implement a link in a Groovy server page that sends a POST request containing the text of the link they clicked on to another GSP, then load that page. I have tried several different solutions to this problem from other questions on StackOverflow, but every single one ends up raising a org.apache.tomcat.util.http.fileupload.FileUploadBase$InvalidContentTypeException: the request doesn't contain a multipart/form-data or multipart/mixed stream, content type header is null error. What's going on here? I'm also interested in different approaches for this.

Request:

<script type="text/javascript" src="resources/post.js"></script>
<a href="actions/manage.gsp" onclick="post('/actions/manage', {name: '${file}'});">${file}</a>

post.js:

function post(path, params, method) {
    method = method || "post";
    var form = document.createElement("form");
    form.setAttribute('enctype','multipart/form-data').
    form.setAttribute("method", method);
    form.setAttribute("action", path);

    for(var key in params) {
        if(params.hasOwnProperty(key)) {
            var hiddenField = document.createElement("input");
            hiddenField.setAttribute("type", "hidden");
            hiddenField.setAttribute("name", key);
            hiddenField.setAttribute("value", params[key]);

            form.appendChild(hiddenField);
        }
    }

    document.body.appendChild(form);
    form.submit();
}

manage.gsp:

<%! static output = "text/html" %>
Testing!
<% log.info("Found ${request.parts.size()} parts") %>

Answer 1

just typo remove dot after form.setAttribute('enctype','multipart/form-data');

function post(path, params, method) {
    method = method || "post";
    var form = document.createElement("form");
    form.setAttribute("enctype","application/x-www-form-urlencoded");
    form.setAttribute("method", method);
    form.setAttribute("action", path);

    for(var key in params) {
        if(params.hasOwnProperty(key)) {
            var hiddenField = document.createElement("input");
            hiddenField.setAttribute("type", "hidden");
            hiddenField.setAttribute("name", key);
            hiddenField.setAttribute("value", params[key]);

            form.appendChild(hiddenField);
        }
    }

    document.body.appendChild(form);
    form.submit();
}

And speaking about the concept, i'd like to offer you this:

function post(path, params, method) {
 method = method || "post";
 var formData = new FormData();
 for(var key in params) {
        if(params.hasOwnProperty(key)) {
           formData.append(key,params[key] );
        }
    }

        $.ajax({
            type: method,
            url: path,
            data: formData,
            cache: false,
            contentType: false,
            processData: false
            }).done(function( result ) { 
               //alert(result)  
            });
}