File upload in a Dialog calls default ajax call

Link to test case: https://editor.datatables.net/examples/extensions/import.html
Debugger code (debug.datatables.net):
Error messages shown:
Description of problem: I have a Dialog with 4 fields. One of the field is the "upload" field type. The Dialog has two buttons "Create" and "Cancel". I want to upload a CSV file and parse using the Papaparser locally (in browser) as given in the example and only when the user clicks "Create" send the data to the backend with the Ajax call. However I am unable to achieve this and followed the example of CSV file Import.

I do not hit the parser at all in the ajax call, but rather it calls the default url from the form. How to disable the the default ajax call and divert it to make ajax call when button is pressed and parse the file contents locally? Please help.

{
            label: "</f:verbatim><h:outputText value="Import CSV File:"/><f:verbatim>",
            name: "fileUpload",
            type: "upload",
            ajax: function(files,done){
                debugger;
                console.log("Papaparser ajax call");
                Papa.parse(files[0], {
                    header: true,
                    skipEmptyLines: true,
                    complete: function (results) {
                        console.log("Papaparser complete");
                        if ( results.errors.length ) {
                            console.log( results );
                        }
                        else {
                            console.log("Success");
                        }
 
                        // Tell Editor the upload is complete - the array is a list of file
                        // id's, which the value of doesn't matter in this case.
                        done([0]);
                    }
                });
            }
}