# Gravity Forms Migration

This guide provides a migration path for WordPress sites using GetAddress with Gravity Forms to switch to Ideal Postcodes.

Both GetAddress and Ideal Postcodes offer address autocomplete for Gravity Forms through HTML custom fields. The migration requires:

1. Replacing the script CDN URL
2. Updating the JavaScript initialization code with the Ideal Postcodes Address Finder
3. Remap your existing input fields to Ideal Postcodes fields

## Side-by-Side Comparison[​](#side-by-side-comparison "Direct link to Side-by-Side Comparison")

### GetAddress Implementation[​](#getaddress-implementation "Direct link to GetAddress Implementation")

```
<script src="https://cdn.getaddress.io/scripts/getaddress-autocomplete-1.0.24.min.js"></script>



<script>

  document.addEventListener("DOMContentLoaded", () => {

    getAddress.autocomplete(

      'input[name="input_1"]',

      "YOUR_GETADDRESS_API_KEY",

      {

        output_fields: {

          line_2: 'input[name="input_2"]',

          line_3: 'input[name="input_3"]',

          town_or_city: 'input[name="input_4"]',

          postcode: 'input[name="input_5"]',

        },

      },

    );

  });

</script>
```

### Ideal Postcodes Implementation[​](#ideal-postcodes-implementation "Direct link to Ideal Postcodes Implementation")

```
<script src="https://cdn.jsdelivr.net/npm/@ideal-postcodes/address-finder-bundled"></script>



<script>

  document.addEventListener("DOMContentLoaded", function () {

    IdealPostcodes.AddressFinder.setup({

      apiKey: "YOUR_IDEAL_POSTCODES_API_KEY",

      outputFields: {

        line_1: 'input[name="input_1"]',

        line_2: 'input[name="input_2"]',

        line_3: 'input[name="input_3"]',

        post_town: 'input[name="input_4"]',

        postcode: 'input[name="input_5"]',

      },

    });

  });

</script>
```

**Key differences:**

* **Function name**: `getAddress.autocomplete()` → `IdealPostcodes.AddressFinder.setup()`
* **API key location**: Second parameter → `apiKey` property in config object
* **Configuration key**: `output_fields` → `outputFields` (camelCase)
* **Field name**: `town_or_city` → `post_town`

## Migration Steps[​](#migration-steps "Direct link to Migration Steps")

### Step 1: Identify Your Address Fields[​](#step-1-identify-your-address-fields "Direct link to Step 1: Identify Your Address Fields")

Gravity Forms uses numeric Field IDs to identify form inputs. You'll need to know the Field ID for each address field in your form.

**If you're already using GetAddress**, you can find your Field IDs in your existing configuration:

```
getAddress.autocomplete(

  'input[name="input_1"]', // Field ID: 1 (autocomplete input)

  "YOUR_GETADDRESS_API_KEY",

  {

    output_fields: {

      line_1: 'input[name="input_2"]',      // Field ID: 2

      line_2: 'input[name="input_3"]',      // Field ID: 3

      line_3: 'input[name="input_4"]',      // Field ID: 4

      town_or_city: 'input[name="input_5"]',// Field ID: 5

      postcode: 'input[name="input_6"]',    // Field ID: 6

    },

  },

);
```

The Field IDs are the numbers in `input[name="input_X"]` - in this example: `1`, `2`, `3`, `4`, `5`, and `6`.

### Step 2: Update Field Mappings[​](#step-2-update-field-mappings "Direct link to Step 2: Update Field Mappings")

The CSS selectors from your GetAddress `output_fields` can be **reused directly** in Ideal Postcodes `outputFields`. You only need to update the field names (keys).

**Your existing GetAddress config:**

```
output_fields: {

  line_1: 'input[name="input_2"]',      // ← This selector stays the same

  line_2: 'input[name="input_3"]',      // ← This selector stays the same

  line_3: 'input[name="input_4"]',      // ← This selector stays the same

  town_or_city: 'input[name="input_5"]',// ← Changes to post_town

  postcode: 'input[name="input_6"]',    // ← This selector stays the same

}
```

**Becomes:**

```
outputFields: {

  line_1: 'input[name="input_2"]',

  line_2: 'input[name="input_3"]',

  line_3: 'input[name="input_4"]',

  post_town: 'input[name="input_5"]',   // ← Field name changed

  postcode: 'input[name="input_6"]',

}
```

See the [Address Field Mapping Reference](/docs/migrate/getaddressio/field-mapping.md) for additional fields.

Field Selectors Stay the Same

The CSS selector format `'input[name="input_X"]'` works for both services. Copy the selectors directly—only update the field names (keys).

### Step 3: Replace GetAddress Script with Ideal Postcodes[​](#step-3-replace-getaddress-script-with-ideal-postcodes "Direct link to Step 3: Replace GetAddress Script with Ideal Postcodes")

Locate your existing GetAddress HTML block in your Gravity Form and **replace it entirely**.

Use the [Autocomplete JS Library Migration Guide](/docs/migrate/getaddressio/js-autocomplete.md) to:

1. Replace the CDN script URL
2. Update the initialization code from `getAddress.autocomplete()` to `IdealPostcodes.AddressFinder.setup()`
3. Update field mappings using the selectors from Step 2
4. Replace your API key

**Example Ideal Postcodes implementation:**

```
<script src="https://cdn.jsdelivr.net/npm/@ideal-postcodes/address-finder-bundled"></script>



<script>

  document.addEventListener("DOMContentLoaded", function () {

    IdealPostcodes.AddressFinder.setup({

      apiKey: "ak_test", // Replace with your Ideal Postcodes API key

      outputFields: {

        line_1: 'input[name="input_2"]', // Update to match your Field IDs

        line_2: 'input[name="input_3"]',

        line_3: 'input[name="input_4"]',

        post_town: 'input[name="input_5"]',

        postcode: 'input[name="input_6"]',

      },

    });

  });

</script>
```

## Links[​](#links "Direct link to Links")

* [Autocomplete JS Library Migration Guide](/docs/migrate/getaddressio/js-autocomplete.md) - Complete JavaScript migration instructions
* [Address Finder Documentation](/docs/address-finder.md) - Configuration options and advanced features

## Need Help?[​](#need-help "Direct link to Need Help?")

We are available 9am to 5pm UK time on chat or email <support@ideal-postcodes.co.uk> for migration assistance.