JSFiddle - React, Tailwind, and code Playground

by Thomas Langford

HTML

<select name="city" size="10" multiple id="city">
        <option value="0">Allen</option>
        <option value="1">Arlington</option>
        <option value="2">Aubrey</option>
        <option value="3">Bedford</option>
        <option value="4">Burleson</option>
        <option value="5">Carrollton</option>
        <option value="6">Cedar Hill</option>
        <option value="7">Commerce</option>
        <option value="8">Coppell</option>
        <option value="9">Dallas</option>
        <option value="10">Decatur</option>
    </select>
    <br />
<input name="submit" type="submit" value="Search" onclick="checkForm(); return false;"  class="search"></input>

JavaScript

function checkForm() {
    citySelection = document.getElementById("city");
    citySelectedValue = citySelection.options[citySelection.selectedIndex].value;
    citySelectedHTML = citySelection.options[citySelection.selectedIndex].innerHTML;
    if (empty(citySelectedHTML)) {
        console.log("NO SELECTION MADE");
    } else {
        console.log("USER MADE A SELECTION");
    }
}

//by James Edwards, http://www.sitepoint.com/testing-for-empty-values/
function empty(data) {
    if (typeof (data) == 'number' || typeof (data) == 'boolean') {
        return false;
    }
    if (typeof (data) == 'undefined' || data === null) {
        return true;
    }
    if (typeof (data.length) != 'undefined') {
        return data.length == 0;
    }
    var count = 0;
    for (var i in data) {
        if (data.hasOwnProperty(i)) {
            count++;
        }
    }
    return count == 0;
}