bootstrap validation regular expression to validate a custom location

Question

I have a form where user select the location (Ajax auto suggestion based). the auto populated location format is like..

New Albany, IN, United States

i.e City-name comma country-code comma country-name.

I want to avoid user entering his own format like (NewAlbay United States)

How to write bootstrap validation of regex to validate it?

no..it would be too much :) – user1493834 Dec 24 '14 at 10:14 — user1493834, Dec 24 '14 at 10:14

miguelote · Answer 1 · 2015-08-19T14:16:46.347

I suggest an autocomplete form field:

<g:javascript>
$(window).load(function(){
    $(function() {
        var availableTags = [];

        $.ajax({url: "${resource(dir: 'js', file: 'communes.json')}",
            success: function (obj, status, request) {
                var jsonObj = $.parseJSON(obj);
                availableTags = jsonObj;
                $(".autocomplete").autocomplete({
                    source: availableTags
                });
                var a = 0;
            },
            error: function (request, status, error) {
                createModalAlert(error, 'error');
            }
        });
    });
});
</g:javascript>


<div class="form-group">
    <label for="inputCommune" class="col-xs-3 control-label"><g:message code="registerForm.placeholder.comune"/></label>
    <div class="col-xs-8">
        <input type="text" class="form-control autocomplete" name="inputCommune" id="inputCommune" value="${params.inputCommune}"
            placeholder="${message(code: 'registerForm.placeholder.comune')}"
            pattern="[a-zA-ZñÑ, \']{5,}"
            >
    </div>
</div>

In js/communes.json you have to put your populated locations

[
  "New Albany, IN, United States",
  "New York ...",
  ...,
  ...
]

bootstrap validation regular expression to validate a custom location

1 Answers1