Bank Validation Implementation Guide

Reduce failed payments and fraud by validating UK bank account details at checkout or in payment forms.

Who Should Use This Guide

For: Business owners and developers integrating bank validation without complex setup. You’ll need: A Loqate API key and basic HTML knowledge. Not covered: Tag-based integrations (see Tag Setup) or pre-built platform integrations (see Integrations).

What You’ll Build

A bank validation form that:

Validates sort codes and account numbers in real-time
Displays success or error states
Prevents form submission with invalid bank details
Shows bank and branch information

Quick Start

To set up Bank Validation, you’ll need an API key. Find out how to get yours here.

Choose Your Approach

Standalone Form
Integrate with Existing Form

Use case: Testing the API or adding to a static pageA self-contained HTML file you can copy and use immediately.Jump to standalone HTML example

Using Shopify or WordPress? Check pre-built integrations.

Add Your Key

Replace YOUR_API_KEY in the code with your actual Loqate API key.

Test

Open your page
Enter sort code 40-47-84 and account number 70872490
Validation result appears

Examples validate UK bank accounts. For international accounts (IBAN), see the International Validate endpoint.

Sample Project: Payment Form Integration

This walkthrough shows how to add bank validation to a payment form. Follow along to see a basic form transform into a validation-enabled payment form.

This is a detailed walkthrough. If you just want working code, skip to Integration Example or Standalone HTML Example.

Before: Basic Payment Form

A payment form without validation: This form works, but doesn’t validate bank details. Let’s add validation.

How Bank Validation Works

The integration includes four key components:

1. Validation Function

A JavaScript function that sends sort codes and account numbers to the Loqate API and returns validation results. The function handles API requests, error checking, and response parsing.

2. Visual Feedback

CSS classes and a message element that show users three states:

Checking: Yellow background while validating
Valid: Green background for valid bank details
Invalid: Red background for invalid or mismatched details

3. Real-Time Validation

Event listeners on both sort code and account number fields that trigger validation when users finish typing (on blur). This provides immediate feedback without requiring form submission.

4. Form Submission Control

Logic that prevents form submission if bank details are invalid, ensuring only validated payment information is processed.

Standalone HTML Example

A minimal bank validation form for quick testing: Perfect for:

Quick API testing
Learning how bank validation works
Simple integrations without checkout flows

To use:

Copy the code
Replace YOUR_API_KEY
Save and test with different sort codes and account numbers

Test with UK sort codes only. For IBAN validation, use the International Validate endpoint.

Code on GitHub

If you’d like to browse the code snippets in this implementation guide or clone them, visit the repository on GitHub.

Integration Example

Here’s the payment form with all validation components integrated: To use this code:

Copy the code
Replace YOUR_API_KEY with your actual Loqate API key
Save as an HTML file
Open in a browser to test
Customize styling to match your brand

Key features in this example:

Real-time validation on field exit
Visual feedback for all validation states
Form submission prevention for invalid details
Bank and branch information display
Clean, production-ready code structure

This example validates UK bank accounts only. The sort code must be 6 digits (with or without hyphens) and the account number must be 8 digits.

Integration Tips

Adding to Your Existing Forms

To add bank validation to your current forms:

Add the validation function from the integration example to your page’s <script> section
- Handles API requests and response parsing
Add validation styles from the integration example to your page’s <style> section
- Provides visual feedback (valid/invalid/checking states)
Add the validation message element next to your bank details fields
- <span id="bankValidation"></span>
Add the event listeners to trigger validation and control form submission
- Blur events for real-time validation on both fields
- Submit event to prevent invalid submissions

Reference the integration example above for all the code you need.

Sort Code Formatting

The API accepts sort codes with or without hyphens:

404784 (6 digits, no hyphens)
40-47-84 (with hyphens)

Both formats are valid. The API returns the sort code in 6-digit format without hyphens. Auto-format user input:

function formatSortCode(value) {
    // Remove non-digits
    const digits = value.replace(/\D/g, '');
    
    // Add hyphens: 40-47-84
    if (digits.length >= 2) {
        return digits.slice(0, 2) + '-' + 
               digits.slice(2, 4) + '-' + 
               digits.slice(4, 6);
    }
    return digits;
}

sortCodeInput.addEventListener('input', function(e) {
    e.target.value = formatSortCode(e.target.value);
});

Account Number Formatting

Account numbers must be exactly 8 digits. Pad shorter numbers with leading zeros:

function formatAccountNumber(value) {
    const digits = value.replace(/\D/g, '');
    return digits.padStart(8, '0').slice(0, 8);
}

Validation Timing Options

Current examples use: Validation on field exit (blur event) - validates when users click or tab away from either field. Alternative approaches: On button click: Add a separate “Validate” button that triggers validation manually. After both fields complete: Validate only after both sort code and account number are entered. On form submission only: Validate only when the user submits the form, showing errors before processing.

Handling StatusInformation

The StatusInformation field provides details about validation results:

Status	Meaning	Action
`OK`	Details are valid	Accept and process
`DetailsChanged`	Corrected automatically	Use `CorrectedSortCode` and `CorrectedAccountNumber`
`CautiousOK`	Valid but no validation rules	Accept with caution (rare)
`UnknownSortCode`	Sort code not found	Reject the details

Example handling:

const result = await validateBank(sortCode, accountNumber);

if (result.IsCorrect === "Yes" || result.IsCorrect === true) {
    if (result.StatusInformation === "DetailsChanged") {
        // Use corrected values
        sortCodeInput.value = result.CorrectedSortCode;
        accountInput.value = result.CorrectedAccountNumber;
        showSuccess("Bank details corrected and validated");
    } else {
        showSuccess("Bank details validated");
    }
} else {
    showError("Invalid bank details");
}

Displaying Bank Information

Show users their bank and branch information for confirmation:

if (result.Bank && result.Branch) {
    const bankInfo = `${result.Bank} - ${result.Branch}`;
    document.getElementById('bankInfo').textContent = bankInfo;
}

Note: Branch addresses may show central processing centers, not physical branches. This is normal for BACS operations.

Styling Customization

The examples use minimal styling. Customize the CSS classes (.bank-valid, .bank-invalid, .bank-checking) to match your brand:

Change colors to match your design system
Adjust padding and border-radius
Add icons or animations
Modify font sizes and weights

Troubleshooting

Invalid API Key

Verify you’ve replaced YOUR_API_KEY with your actual key from your Loqate account.

Bank Details Not Validating

Check:

Sort code is exactly 6 digits (with or without hyphens)
Account number is exactly 8 digits
You have available credits in your account
API key hasn’t been restricted by domain, IP, or rate limits (check account settings)
You’re validating UK bank accounts (not international IBANs)

Unknown Sort Code Errors

If you receive UnknownSortCode:

Verify the sort code is correct (check with the bank)
Ensure it’s a valid UK sort code
Some newer or specialized banks may not be in the database

Form Not Appearing

Ensure you copied the standalone HTML file including all <style> and <script> sections. The examples are self-contained and include all required code.

CORS Errors

The examples must be hosted on a web server, not opened as local file:// URLs. Upload to your website or use a development server like Python’s http.server or Node’s http-server.

Data Privacy

Bank details validated through Loqate’s API
Stored in infrastructure logs for 30 days for operational purposes
Results returned immediately
See Privacy Policy for complete details

Important: Bank Validation does not return account holder information. Only sort code and account number validity are verified.

Overview

Location Solutions

Data Validation

Resources

Bank Validation Implementation Guide

Who Should Use This Guide

What You’ll Build

Quick Start

Choose Your Approach

Add Your Key

Test

Sample Project: Payment Form Integration

Before: Basic Payment Form

How Bank Validation Works

1. Validation Function

2. Visual Feedback

3. Real-Time Validation

4. Form Submission Control

Standalone HTML Example

Code on GitHub

Integration Example

Integration Tips

Adding to Your Existing Forms

Sort Code Formatting

Account Number Formatting

Validation Timing Options

Handling StatusInformation

Displaying Bank Information

Styling Customization

Troubleshooting

Invalid API Key

Bank Details Not Validating

Unknown Sort Code Errors

Form Not Appearing

CORS Errors

Data Privacy

Support

Overview

Location Solutions

Data Validation

Resources

​Who Should Use This Guide

​What You’ll Build

​Quick Start

​Choose Your Approach

​Add Your Key

​Test

​Sample Project: Payment Form Integration

​Before: Basic Payment Form

​How Bank Validation Works

​1. Validation Function

​2. Visual Feedback

​3. Real-Time Validation

​4. Form Submission Control

​Standalone HTML Example

​Code on GitHub

​Integration Example

​Integration Tips

​Adding to Your Existing Forms

​Sort Code Formatting

​Account Number Formatting

​Validation Timing Options

​Handling StatusInformation

​Displaying Bank Information

​Styling Customization

​Troubleshooting

​Invalid API Key

​Bank Details Not Validating

​Unknown Sort Code Errors

​Form Not Appearing

​CORS Errors

​Data Privacy

​Support

​Related

Who Should Use This Guide

What You’ll Build

Quick Start

Choose Your Approach

Add Your Key

Test

Sample Project: Payment Form Integration

Before: Basic Payment Form

How Bank Validation Works

1. Validation Function

2. Visual Feedback

3. Real-Time Validation

4. Form Submission Control

Standalone HTML Example

Code on GitHub

Integration Example

Integration Tips

Adding to Your Existing Forms

Sort Code Formatting

Account Number Formatting

Validation Timing Options

Handling StatusInformation

Displaying Bank Information

Styling Customization

Troubleshooting

Invalid API Key

Bank Details Not Validating

Unknown Sort Code Errors

Form Not Appearing

CORS Errors

Data Privacy

Support

Related