Azure Web App - Javascript not working as expected

Question

I have a website running on Azure on .NET Framework 4.7. In that website, I have a form that when filled and on submit, there's a script using JQuery and AJAX which gets the data from the form and sends it to our custom API.

I've added a single new field to the form. Now when I click the submit button, the script sends it to our API. However, that new field is always null.

But when I manually call the script in F12, it properly gets the data and our API gets a value for the new field as expected. But when I trigger it via the button, it doesn't.

I've checked that I'm using the exact same code on Azure and when I F12. I've changed set dynamic caching to 0 and restarted the website but it doesn't resolve the issue. Does WEBSITE_RUN_FROM_PACKAGE or WEBSITE_NODE_DEFAULT VERSION affect it in any way?

Or is the js referenced a different file (minified or some other)? I believe the issue is related to JS not getting me the new field, but I'm not sure why it doesn't when I can do it perfectly fine in F12.

I am also using Umbraco API, but I doubt that it's the problem as the API can properly receive data.

    var model = {
        FirstName: $("#member-register #user_FirstName").val(),
        LastName: $("#member-register #user_LastName").val(),
        PostCode: $("#member-register #user_PostCode").val()
    };

    $.ajax({
        url: "/Umbraco/Api/Member/RegisterMember",
        method: "POST",
        dataType: 'json',
        contentType: 'application/json; charset=utf-8',
        data: JSON.stringify(model),
        success: function (response) {
            $("#register").modal('hide');
            if (response.Success) {
                // Clear the form fields otherwise it will be visible when register is clicked again.
                $("#member-register #user_FirstName").val("");
                $("#member-register #user_LastName").val("");
                $("#member-register #user_PostCode").val("");
            } else {
                $("#registerFailure").modal('show');
            }
        },
        error: function (response) {
            $("#register").modal('hide');
            $("#registerFailure").modal('show');
        }
    })

Answer 1

Turns out we're using the client dependency framework (https://github.com/Shandem/ClientDependency). The JS that was being referenced on Azure was an old one and we had to update the version in ClientDependency.config so that it repackages and uses the latest version.

<clientDependency version="20191028" fileDependencyExtensions=".js,.css" loggerType="Umbraco.Web.UI.CdfLogger, umbraco">