ruwer/brcities

Full package with brazilian cities.

BiRCities for Laravel 5

, _(*1)

• A Laravel 5 package containing all Brazilian cities to your database.
• Auto-fill the cities when you select the state. Built using Vanilla JS.
• Works well with Cep Package.

Installation

Run in your terminal:, _(*2)

composer require "ruwer/brcities":"dev-master"

Open the file config/app.php and add to "providers":, _(*3)

'providers' => [
    // ...
    Ruwer\BRcities\BrcitiesServiceProvider::class,
],

Let's publish the package files into your project. Run in your terminal:, _(*4)

php artisan vendor:publish

Now you have the following files in your project: - database/migrations/2014_10_12_000000_create_cities_table.php - database/seeds/CitiesTableSeeder.php, _(*5)

You also have a copy of brcities.js in the following folders of your project: - public/js/brcities.js - resources/assets/js/brcities.js, _(*6)

So, run in your terminal:, _(*7)

composer dump-autoload
php artisan migrate
php artisan db:seed --class="CitiesTableSeeder"

Done! :), _(*8)

Model

Now you can use your new model City, e.g.:, _(*9)

use Ruwer\BRcities\City;

$states = City::select("state")->distinct("state")->orderBy("state")->get();
$pr_cities = City::where("state", "=", "PR")->orderBy("name")->get();

Routes

You also have the following routes returning JSON, e.g.: - myproject.dev/states - myproject.dev/cities/PR, _(*10)

Usage

Create your form:, _(*11)

<form id="form">
  <select name="state" class="js-state"></select>
  <select name="city" class="js-city"></select>
</form>

Include the .js file:, _(*12)

<script src="{{ asset('js/brcities.js') }}"></script>

Call the script:, _(*13)

<script>
  var cities = new Cities("#form");
</script>

Options

Define the class:, _(*14)

//My Personal Options
var options = {
  stateInput: ".js-state", //default
  cityInput:  ".js-city", //default
  short: false //default (Long state names)
}

//Call the Script
var cities = new Cities("#form", options);

Set placeholders:, _(*15)

<select name="state" class="js-state">
    <option value="">Please select...</option>
</select>
<select name="city" class="js-city">
    <option value="">Please select the state first...</option>
</select>

Default value:, _(*16)

<select name="state" class="js-state" value="PR"></select>
<select name="city" class="js-city" value="3595"></select>