The location picker field uses Google Maps to display a map and search field. A user can enter their location by placing a pin on the map, searching for a named place or postcode, or (should they know it) directly entering their latitude and longitude. However entered, the location will be displayed in the input field and submitted in the format latitude,longitude, ie 50.413399,-4.0997.
As the map is provided by Google, your site will need access to the internet (meaning some internal intranets may run into problems).
Before using the location picker field you should register an account an obtain an API key from Google. This API key can be entered directly into a property in the location picker field or held in the subsite configuration and automatically made available to all of the forms using the field.
Custom Functions
Custom functions can be called from the handlers of other fields using .invokeCustomFieldFn.
search(value) - perform a search using the supplied valuehideMap() - hide the mapshowMap() - show the map
Properties
| Label | Description | Type Name |
|---|---|---|
| Label | The label for this field | LABEL |
| Show Label | Whether to show the label for this field or not. This property adds/removes a class on the field's label element. The styling itself is controlled by the site's stylesheet | SHOWLABEL |
| Hint | Additional information displayed alongside the field to assist the user in completing it. The value of another field can be used by adding the field's name between # characters. See Common Field Properties for more information | HINT |
| Show Location | Whether the location input field should be visible or not | SHOWLOCATION |
| Required | Whether or not the field is required to have a value to pass validation | REQUIRED |
| Default Location | The default location that the map should be centred upon. Set the latitude and longitude, separated by a comma. For example 50.4233524,-4.0965925 | DEFAULTLOC |
| Auto Locate | The field will attempt to set its value as the position, in lat-long, returned by the geo-location feature of the device used to view the form. This will prompt the user to allow their location to be shared with the site | AUTODEFAULT |
| Error Message | The error message that will be displayed if this field fails its validation | ERRMSG |
| Error Message Function | A function that can be used to override the default error message. You can return a different message for each error type. The message can include the value of another field can be used by adding the field's name between # characters. See Error Message Functions for more information. This field has the following error types:
| ERRMSGFUNC |
| Location Width | The display width of the input field. The value matches a CSS class, which actually sets the width | WIDTH |
| Searchable | Whether this field's value should be indexed by the search (the object collection if using the database save action and/or workflow process collection if starting a workflow process). This property is ignored if an External Type is specified for the form. In this case, the ability to search is determined by the searchable property of the type itself | SEARCHABLE |
| Show Button | The text to display on the show map button | SHOWMAPLABEL |
| Hide Button | The text to display on the hide map button | HIDEMAPLABEL |
| Search Button | The text to display on the search button. Leave this blank to omit the search input field and the search button | SEARCHLABEL |
| Reset Button | The text to display on the reset button. Leave this blank to omit the reset button. The reset button resets the entire field to how it was when first loaded | RESETLABEL |
| Clear Button | The text to display on the clear button. Leave this blank to omit the clear button. The clear button clears the search and location fields, but leaves the map focus where it currently is | CLEARLABEL |
| Search Width | The display width of the search field. The value matches a CSS class, which actually sets the width | SEARCHWIDTH |
| Search Hint | Initial search hint text to be displayed in the search input field | SEARCHHINT |
| Map Type | The initial type of Google map to display. the user can change this using controls provided by Google on the map. The following map types are supported: ROADMAP (normal, default 2D map) SATELLITE (photographic map) HYBRID (photographic map + roads and city names) TERRAIN (map with mountains, rivers, etc.) | MAPTYPE |
| Search Position | Whether the search panel is positioned above or below the map. The search panel includes the search input field and the search, reset and clear buttons | SEARCHPOSITION |
| Map Height | Height of the map in pixels | MAPHEIGHT |
| Map Width | Width of the map in pixels | MAPWIDTH |
| Zoom Level | A zoom level of 0 shows the whole Earth. Higher zoom levels focus the map more locally | DEFAULTZOOMLEVEL |
| Expand Map | Whether the map is expanded or hidden when the field first loads | EXPANDMAP |
| Validation Function | A JavaScript function that can be used to provide custom field validation whenever the field value changes or the form is submitted. This function will be executed client-side, provided JavaScript is enabled in the browser, and repeated server-side | VALFUNC |
| Handlers | A JavaScript function that is executed client-side whenever the page loads, or the field value changes. This function is useful for modifying the values of other fields based on an entered value | HANDLERS |
| Read Only | Display the field as read only | READONLY |
| Google Maps API Key | The API key, supplied by Google and registered to your site/user/account that is needed to access Google Maps. If a map API key is set in your subsite configuration this field can be left blank. The key should give access to the "Maps JavaScript API" and "Geocoding API" | APIKEY |
| Google Maps Client ID | A Client ID key, supplied by Google and registered to your site/user/account that is needed to access Google Maps. If a map Client ID key is set in your subsite configuration this field can be left blank. Client ID is used in preference to an API key where both are provided | CLIENTID |
| Additional Styling Modifier | An optional CSS modifier for the field. See Common Field Properties for an example | ADDITIONALSTYLINGMODIFIER |
| Documentation | Add documentation to your field to help explain any complex functionality to future users. You might include information on what the field does and how it relates to other fields on the form. Notes added here are only ever visible in the Forms Designer, they can be searched for, viewed and downloaded from the action panel. See Common Field Properties for an example | DOCUMENTATION |
Share this page
