Code Monkey home page Code Monkey logo

location-plugin's Introduction

Location plugin

This plugin adds location based features to OctoberCMS.

  • Easily add Country and State to any model
  • Form widget for address lookups (Google API)

Add Country and State to any model

This plugin provides an easy way to add location fields, country and state, to any model. Simply add these columns to the database table:

$table->integer('country_id')->unsigned()->nullable()->index();
$table->integer('state_id')->unsigned()->nullable()->index();

Then implement the RainLab.Location.Behaviors.LocationModel behavior in the model class:

public $implement = ['RainLab.Location.Behaviors.LocationModel'];

This will automatically create two "belongs to" relationships:

  1. state - relation for RainLab\Location\Models\State
  2. country - relation for RainLab\Location\Models\Country

Back-end usage

You are free to add the following form field definitions:

country:
    label: Country
    type: dropdown
    placeholder: -- select --

state:
    label: State
    type: dropdown
    placeholder: -- select --
    dependsOn: country

Front-end usage

The front-end can also use the relationships by creating a partial called country-state with the content:

{% set countryId = countryId|default(form_value('country_id')) %}
{% set stateId = stateId|default(form_value('state_id')) %}

<div class="form-group">
    <label for="accountCountry">Country</label>
    {{ form_select_country('country_id', countryId, {
        id: 'accountCountry',
        class: 'form-control',
        emptyOption: '',
        'data-request': 'onInit',
        'data-request-update': {
            'country-state': '#partialCountryState'
        }
    }) }}
</div>

<div class="form-group">
    <label for="accountState">State</label>
    {{ form_select_state('state_id', countryId, stateId, {
        id: 'accountState',
        class: 'form-control',
        emptyOption: ''
    }) }}
</div>

This partial can be rendered in a form with the following:

<div id="partialCountryState">
    {% partial 'country-state' countryId=user.country_id stateId=user.state_id %}
</div>

Short code accessors

The behavior will also add a special short code accessor and setter to the model that converts country_code and state_code to their respective identifiers.

// Softly looks up and sets the country_id and state_id
// for these Country and State relations.

$model->country_code = "US";
$model->state_code = "FL";
$model->save();

Address Finder Form Widget

This plugin introduces an address lookup form field called addressfinder. The form widget renders a Google Maps autocomplete address field that automatically populates mapped fields based on the value entered and selected in the address.

Available mappings:

  • street
  • city
  • zip
  • state
  • country
  • country-long
  • latitude
  • longitude

Usage:

# ===================================
#  Form Field Definitions
# ===================================

fields:
    address:
        label: Address
        type: addressfinder
        fieldMap:
            latitude: latitude
            longitude: longitude
            city: city
            zip: zip
            country: country_code
            state: state_code

        city:
            label: City
        zip:
            label: Zip
        country_code:
            label: Country
        state_code:
            label: State
        latitude:
            label: Latitude
        longitude:
            label: Longitude

location-plugin's People

Contributors

daftspunk avatar gergo85 avatar theservat avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.