diff --git a/src/components/ZoneFilterPanel.js b/src/components/ZoneFilterPanel.js
index 8371c98..e383e87 100644
--- a/src/components/ZoneFilterPanel.js
+++ b/src/components/ZoneFilterPanel.js
@@ -62,35 +62,69 @@ export function ZoneFilterPanel({ onFilterSelect, autoFocus }) {
           {currentFilterName => {
             const current = currentFilterName === state.query
             return (
-              <input
-                disabled={!current}
-                ref={inputRef}
+              <div
                 css={{
-                  border: `1px solid "#999999"`,
-                  width: "200px",
-                  boxSizing: "border-box",
-                  padding: 10,
-                  fontSize: 16,
                   marginLeft: 10,
                 }}
-                onChange={e => {
-                  const { value } = e.target
-                  setState({ ...state, value: value })
-                }}
-                onBlur={e => {
-                  setState({ ...state, value: state.query })
-                }}
-                onKeyPress={e => {
-                  if (e.key == "Enter" && isProvinceExist(state.value)) {
-                    trackEvent("Search for province")
-                    setState(
-                      { ...state, query: state.value },
-                      navigate(filterPath(state.value))
-                    )
-                  }
-                }}
-                value={state.value}
-              />
+              >
+                <input
+                  disabled={!current}
+                  ref={inputRef}
+                  css={{
+                    border: `1px solid`,
+                    borderColor: state.provinceError ? "#FF0000" : "#999999",
+                    width: "200px",
+                    boxSizing: "border-box",
+                    padding: 10,
+                    fontSize: 16,
+                  }}
+                  onChange={e => {
+                    // @todo #223 show dropdown or "autocomplete" for province name?
+                    const { value } = e.target
+                    setState({ ...state, value: value, provinceError: false })
+                  }}
+                  onBlur={e => {
+                    if (!state.noOnBlur) {
+                      setState({ ...state, value: state.query })
+                    } else {
+                      setState({
+                        ...state,
+                        noOnBlur: false,
+                        provinceError: false,
+                      })
+                    }
+                  }}
+                  onKeyPress={e => {
+                    const { value } = state
+                    if (e.key == "Enter") {
+                      if (isProvinceExist(state.value)) {
+                        trackEvent("Search for province")
+                        setState(
+                          { ...state, query: state.value },
+                          navigate(filterPath(state.value))
+                        )
+                      } else {
+                        setState({
+                          ...state,
+                          value: value,
+                          noOnBlur: true,
+                          provinceError: true,
+                        })
+                      }
+                    }
+                  }}
+                  value={state.value}
+                />
+                <span
+                  css={{
+                    display: state.provinceError ? "block" : "none",
+                    color: "#FF0000",
+                    width: "100%",
+                  }}
+                >
+                  ไม่พบจังหวัดที่ท่านระบุ
+                </span>
+              </div>
             )
           }}
         </ZoneFilterContext.Consumer>