JSFiddle - React, Tailwind, and code Playground

by willtx

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<div class="container">
<div class="panel-body">
    <div class="col-md-3">
        <form class="form text-left" role="form">
            <div class="checkbox">
                <label>
                    <input type="checkbox" ng-model="globalSearch"> Global Search
                </label>
            </div>
            <div class="form-group">
                <label for="filter_brand">Brand</label>
                <select id="filter_brand" class="form-control" ng-model="SelectedBrand" ng-options="b.name for b in brands" ng-change="refreshMap()">
                    <option value="">All Brands</option>
                </select>
            </div>
            <div class="form-group">
                <label for="filter_customer">Customer</label>
                <select id="filter_customer" class="form-control" ng-model="SelectedCustomer" ng-options="c.name for c in customers" ng-change="refreshMap()">
                    <option value="">select a customer</option>
                </select>
            </div>

            <label>Location</label>
            <div class="form-group domestic">
                <select id="filter_country" class="form-control" ng-model="SelectedCountry" ng-disabled="!SelectedCustomer" ng-options="c.name for c in SelectedCustomer.countries" ng-change="refreshMap()">
                    <option value="">select a country</option>
                </select>
                <select id="filter_state" class="form-control" ng-model="SelectedState" ng-disabled="!SelectedCountry" ng-options="s.name for s in SelectedCountry.states"...