How to make all texbox when leaving have one label error mes

Question

Hi Team

 

I have 5 textbox and want to find a way to make them when leaving will have label error message. So far i have done the following and seem not winning, kind need of an assistance please mates.

<div class="row">
                            <label for="Address">Address</label>
                            <div class="col-md-6 ">
                                <div class="input-group pull-right">

                                    @Html.TextBoxFor(m => m.HomeMainModel.Address, new { @class = "form-control", type = "text", id = " street address", autofocus = "autofocus", placeholder = "Street Address", required = "required" })
                                    <div class="input-group-append">
                                        <div class="input-group-text">

                                        </div>
                                    </div>

                                </div>

                            </div>
                        </div>
                        <div class="col-md-6 col-sm-10 col-xs-10">
                            <label id="labelMessaget" class="text-danger" style="display:none"></label>
                        </div>
                        <hr />
                        <div class="row">
                            <div class="col-md-6 ">
                                <div class="input-group pull-right">

                                    @Html.TextBoxFor(m => m.HomeMainModel.Address, new { @class = "form-control", type = "text", id = "address", autofocus = "autofocus", placeholder = "Street Address Line 2", required = "required" })
                                    <div class="input-group-append">
                                        <div class="input-group-text">
                                        </div>
                                    </div>
                                </div>

                            </div>
                        </div>


       <div class="form-group">
                            <div class="input-group mb-2">
                                <div class="input-group-prepend">

                                </div>

                                <div class="input-group col-md-7 col-md-offset-7 col-sm-7 col-xs-7">
                                    <div class="input-group pull-right">

                                        @Html.TextBoxFor(m => m.HomeMainModel.City, new { @class = "form-control", type = "text", id = "city", autofocus = "autofocus", placeholder = "City", required = "required" })

                                        @Html.TextBoxFor(m => m.HomeMainModel.State, new { @class = "form-control", type = "text", id = "state", autofocus = "autofocus", placeholder = "State/ Province", required = "required" })

                                        <div class="input-group-append">
                                            <div class="input-group-text">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6 col-sm-10 col-xs-10">
                                <label id="labelMessaget" class="text-danger" style="display:none"></label>
                            </div>


<div class="input-group mb-2">
                                <div class="input-group-append">

                                </div>
                                <div class="input-group col-md-7 col-md-offset-3 col-sm-2 col-xs-2">
                                    <div class="input-group pull-right">


                                        @Html.TextBoxFor(m => m.HomeMainModel.Code, new
                                   {
                                       @class = "form-control",
                                       type = "text",
                                       id = "postal code",
                                       autofocus = "autofocus",
                                       placeholder = "Postal/Zip Code"

                                        })

                                        @Html.DropDownListFor(m => m.HomeMainModel.SelectedCountryId, this.ViewBag.CountryList as SelectList, new { @class = "form-control" })
                                        <div class="input-group-append">
                                            <div class="input-group-text">

                                            </div>
                                        </div>

                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6 col-sm-10 col-xs-10">
                            <label id="labelMessaget" class="text-danger" style="display:none"></label>
                        </div>



        // function when leaving texbox for city, street address, street_address_line2, state_province.

    $(function() {
    $('#City').blur(function() {
        var city = document.getElementById("City").value;
        var expr = /^([\w-\.]+)@@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/;
        if (!expr.test(city)) {
            document.getElementById("labelMessaget").style.display = "inline";
        } else {
            document.getElementById("labelMessaget").style.display = "none";
        }
    });
});