Skip to main content
The Latitude component is a specialized numeric input for capturing latitude coordinates with automatic validation and precision handling.

​
Basic Usage

<x-forms::latitude 
    name="latitude" 
    label="Location Latitude" 
/>

​
With Model Binding

<x-forms::latitude 
    name="location.latitude" 
    label="Latitude"
    :model="$venue"
/>

​
Component Attributes

​
name
string
required
The input field name
​
label
string
default:""
Label text displayed above the input
​
model
mixed
default:"null"
Model instance for automatic value binding
​
default
mixed
default:"null"
Default value when no model or old input exists
​
showErrors
boolean
default:"true"
Display validation errors below the input
​
showLabel
boolean
default:"true"
Show or hide the label
​
placeholder
string
default:""
Input placeholder text
​
showPlaceholder
boolean
default:"false"
Auto-generate placeholder from label
​
required
boolean
default:"false"
Mark field as required
​
inline
boolean
default:"false"
Display label and input inline (horizontal layout)
​
floating
boolean
default:"false"
Enable floating label style
​
inlineLabelClass
string
default:""
Additional CSS classes for inline label
​
inlineInputClass
string
default:""
Additional CSS classes for inline input wrapper
​
showJsErrors
boolean
default:"false"
Enable JavaScript validation error display
​
framework
string
default:""
CSS framework override (bootstrap-5, material-admin-26)

​
Default Attributes

The Latitude component automatically applies these HTML attributes:
  • type: number
  • step: 0.000001 (6 decimal precision)
  • min: -90 (South Pole)
  • max: 90 (North Pole)

​
Examples

​
With Validation

<x-forms::latitude 
    name="coordinates.lat" 
    label="Latitude"
    required
    :model="$location"
/>

​
Inline Layout

<x-forms::latitude 
    name="lat" 
    label="Latitude"
    inline
/>

​
Custom Placeholder

<x-forms::latitude 
    name="location_lat" 
    label="Venue Latitude"
    placeholder="e.g., 4.1755"
/>

​
With Map Input

The Latitude component is commonly used alongside Map Input: 
<x-forms::map-input
    name="location"
    label="Location"
    lat-name="latitude"
    lng-name="longitude"
    :model="$venue"
    :enable-coordinates="true"
/>

​
Geospatial Integration

When using with Laravel Eloquent Spatial models: 
use MatanYadaev\EloquentSpatial\Objects\Point;

class Venue extends Model
{
    protected $casts = [
        'location' => Point::class,
    ];
}

{{-- Map input automatically extracts lat/lng from Point --}}
<x-forms::map-input
    name="location"
    label="Venue Location"
    :model="$venue"
/>

​
Notes

  • The component extends the base Input component with type="number"
  • Latitude values are constrained between -90° (South) and 90° (North)
  • Precision is set to 6 decimal places (approximately 0.11 meters accuracy)
  • Works seamlessly with the Map Input component for visual coordinate selection
  • Supports model binding with Point objects from eloquent-spatial package

Build docs developers (and LLMs) love

Get started for freeTalk to us