I am trying to upload a file but i don't understand how i can change the file name before uploading

html part

<form class="float-sm-right"method="POST" enctype="multipart/form-data" id="fileUploadForm">
<div class="uploadbutton"><input class="hide_file" id="myfilefield" onchange="this.form.submit()" type="file" name="files" multiple>Upload</div>
</form>

Script part

    document.getElementById('myfilefield').onchange = function() {
        event.preventDefault();
        var form = $('#fileUploadForm')[0];
        var data = new FormData(form);
        $("#btnSubmit").prop("disabled", true);
        $.ajax({
            type: "POST",
            enctype: 'multipart/form-data',
            url: "<?= Pterodactyl::serverUploadFile();?>",
            data: data,
            processData: false,
            contentType: false,
            cache: false,
            timeout: 600000,
            success: function (data) {
                $("#result").text(data);
                console.log("SUCCESS : ", data);
                $("#btnSubmit").prop("disabled", false);
                window.location.reload();
            },
            error: function (e) {
                $("#result").text(e.responseText);
                console.log("ERROR : ", e);
                $("#btnSubmit").prop("disabled", false);
            }
        });
    };

I dont get how i can change the filename before uploading.