Jquery – Passing two parameters (IFormFile and a string) with JSON to C#

Versions:
ASP.NET and Web Tools – 17.10.341.11210
C# Tools – 4.10.0-3.24312.19+
JQuery – 3.3.1.js
JS – 2.8.3.js

I’m trying to pass an IFormFile and a string from a JSON file select and a string input.

The File Selection and string input both work (I’ve used alerts to confirm that both collect the right information)

When I send them together to my C# method, they both arrive null (even though they aren’t from previous testing). My JavaScript and HTML code:

HTML:

<div class="text-center">
    <h1 class="display-4">Validation</h1>
    <p>
        <label for="string" style="margin: 5px">String Validation?</label>
        <br />
        <input type="email" id="string" name="string" value="[email protected]" style="margin:5px;">
        <br />
    </p>
</div>


<div class="text-center">
    <label for="fileSelection" style="margin: 5px">Please select which file you would like to validate.</label>
    <br />
    <span id="csvOnly" class="uploadErrorMsg">Only CSV files are able to be uploaded</span>
    <br />
    <input type="file" id="fileSelection" name="fileSelection" accept=".csv, text/csv" />
    <br />
    <button id="btnValidate" onclick="btnValidate()">Validate</button> <!--onclick="btnUpload_Click()" name="btnUpload" -->
    <br />
    <label id="lblError"></label>

</div>

Javascript:

function btnValidate() {
    input = document.getElementById('fileSelection');
    file = input.files[0];
    fileName = file.name;
    fileName = fileName.toUpperCase();
    
    //alert("file = " + file.name); //good

    var stringSelection = document.getElementById('string').value;
    //alert("string is = " + stringSelection); //good

    if (fileName.includes('CSV')) {
        //alert("string is = " + stringSelection); //good

        var data = new FormData();
        file = input.files[0];
        data.append("File", file);
        console.log(data);
        //alert("file = " + data.values);

        //var parameters = { file: data, inputString: stringSelection };
        //alert("parameters = " + parameters.inputString" " + parameters.file); //bad
        //alert("parameters = " + parameters.file.value); //good

        $.ajax({
            type: "POST",
            url: "@Url.Content("~/Validation/UploadFile")",
            dataType: 'json',
            contentType: false,
            processData: false,
            data: { file:data, inputString: stringSelection},
    //other things I've tried
    //JSON.stringify({ file: data, inputString: 'stringSelection' }),
    //'{ "file":' + data + ', "inputString": "stringSelection" }', 
    //JSON.stringify({ parameters }),
    //{parameters},
            
            success: function(data){
                return result;
            },
            error: function (xhr, status, error) {
                alert("error message " + error + " " + status);
            }
        });
    }
}

C# Code

public JsonResult UploadPayrollFile(IFormFile file, string stringSelection)
{
    //do stuff
    //I setup a breakpoint here to check to see what information is coming in, both parameters are coming in null. 
    //When I adjust the method to check for a singular parameter, they work (separately)
}

I walked through this question here and those options did not work for me.

The program actually runs. It doesn’t throw errors.