I want to add red borders to required fields, if the fields are empty. The ShowSelection() function is run when the interface is loaded, and everytime the interface is refreshed. The code is written for Siebel OpenUI, which has some proprietary functionality such as "GetPM()", "GetInputName()" etc. The inputRedborder class contains red 2px border.

I suspect there is a better way to write the code, and I am therefore happy for all help I can get to improve the code.

Edit: Based on reading about the bind functionality, I have also understood that I should bind functions only once. So ideally I need to change the code to only bind the functions to the inputs on load.

function redBorder(controlName) {
    var input = $('[name=' + controls[controlName].GetInputName() + ']'); // get input element
    // custom logic for field "EmailAddress"
    if (controlName === "EmailAddress") {
        var pAddress = $('[name=' + controls["Personal Address"].GetInputName() + ']'); // get Personal Address input element
        var postalCode = $('[name=' + controls["Personal Postal Code"].GetInputName() + ']'); // get Personal Postal Code input element
        var postalCity = $('[name=' + controls["Personal City"].GetInputName() + ']'); // get Personal City input element
        if (!pAddress.val() && !postalCode.val()) {
            if (!input.val()) {
                input.addClass("inputRedborder"); // add red border if required input element is empty
            } else if (input.val()) {
                input.removeClass("inputRedborder"); // remove red border if required input element is not empty
            }
        }
        // remove previously binded events
        input.unbind();
        // then add event listeners to input element to handle input changes
        input.bind('change keyup', function () {
            if (!pAddress.val() && !postalCode.val()) {
                var input = $(this);
                if (!input.val()) { // add red border if required input element is empty
                    input.addClass("inputRedborder");
                    pAddress.addClass("inputRedborder");
                    postalCode.addClass("inputRedborder");
                    postalCity.addClass("inputRedborder");
                } else if (input.val()) { // remove red border if required input element is empty
                    input.removeClass("inputRedborder");
                    pAddress.removeClass("inputRedborder");
                    postalCode.removeClass("inputRedborder");
                    postalCity.removeClass("inputRedborder");
                }
            }
        });
    }
    // custom logic for address fields
    else if (controlName === "Personal Address" || controlName === "Personal Postal Code" || controlName === "Personal City") {
        var eMail = $('[name=' + controls["EmailAddress"].GetInputName() + ']'); // get EmailAddress input element
        var pAddress = $('[name=' + controls["Personal Address"].GetInputName() + ']'); // get Personal Address input element
        var postalCode = $('[name=' + controls["Personal Postal Code"].GetInputName() + ']'); // get Personal Postal Code input element
        var postalCity = $('[name=' + controls["Personal City"].GetInputName() + ']'); // get Personal City input element
        if (!eMail.val()) {
            if (!input.val()) { // add red border if required input element is empty
                input.addClass("inputRedborder");
            } else if (input.val()) { // remove red border if required input element is empty
                input.removeClass("inputRedborder");
            }
        }
        // remove previously binded events
        input.unbind();
        // then add event listeners to input element to handle input changes
        input.bind('change keyup', function () {
            if (!eMail.val()) {
                var input = $(this);
                if (!input.val()) { // add red border if required input element is empty
                    input.addClass("inputRedborder");
                    if (controlName === "Personal Postal Code") { // add red border to Postal City if Postal Code is empty
                        postalCity.addClass("inputRedborder");
                    }
                    if (!pAddress.val() && !postalCode.val()) { // if all address fields are empty, add red border also to EmailAddress
                        eMail.addClass("inputRedborder");
                    }
                } else if (input.val()) { // remove red border if required input element is empty
                    $(input).removeClass("inputRedborder");
                    eMail.removeClass("inputRedborder");
                    if (controlName === "Personal Postal Code") {
                        postalCity.removeClass("inputRedborder");
                    }
                }
            }
        });
    }
    // general logic for rest of the required fields
    else {
        if (!input.val()) { // add red border if required input element is empty
            input.addClass("inputRedborder");
        } else if (input.val()) { // remove red border if required input element is empty
            input.removeClass("inputRedborder");
        }
        // remove previously binded events
        input.unbind();
        // then add event listeners to input element to handle input changes
        input.bind('change keyup', function () {
            var input = $(this);
            if (!input.val()) { // add red border if required input element is empty
                input.addClass("inputRedborder");
            } else if (input.val()) { // remove red border if required input element is empty
                input.removeClass("inputRedborder");
            }
        });
    }
}

function removeRedBorder(controlName) {
    var input = $('[name=' + controls[controlName].GetInputName() + ']'); // get input element
    input.removeClass("inputRedborder"); // remove red border
}

function fieldValidation() {
    var consentCheckbox = $('[name=' + controls["R Consent"].GetInputName() + ']');
    //setting required fields
    var requiredFields = ["Birth Date", "CellularPhoneNum", "FirstName", "LastName", "EmailAddress", "Personal Address", "Personal Postal Code", "Personal City"];
    // check if applet is in query mode
    if (!pm.Get("IsInQueryMode")) {
        // check if Consent is checked
        if (consentCheckbox.is(":checked")) {
            // calling function for each required field
            $.each(requiredFields, function (i, controlName) {
                redBorder(controlName);
            });
        } else {
            // remove all red borders if Consent is not checked
            $.each(requiredFields, function (i, controlName) {
                removeRedBorder(controlName);
            });
        }
    } else {
        // remove all red borders if user enters query mode
        $.each(requiredFields, function (i, controlName) {
            removeRedBorder(controlName);
        });
    }
}

// R 01.02.16 DGR: Added
function ShowSelection() {
    //console.log("// ShowSelection");
    pm = this.GetPM();
    var consentCheckbox = $('[name=' + controls["R Consent"].GetInputName() + ']');
    consentCheckbox.addClass("hidden");
    fieldValidation();
    var signatureType = $('[name=' + controls["R Signature Type"].GetInputName() + ']');
    $(signatureType).focusout(function () {
        fieldValidation();
    })
}