<div class="col-md-12" ng-controller="EditClientAddressController">
    <div>
        <ul class="breadcrumb">
            <li><a href="#/clients">{{'label.anchor.clients'|translate}} </a></li>
            <li><a href="#/viewclient/{{clientId}}">{{'label.anchor.viewclient' | translate}}</a></li>
            <li class="active">{{'label.anchor.editclientaddress' | translate}}</li>
        </ul>
    </div>
    <form name="editaddressform" novalidate="" class="form-horizontal well" rc-submit="submit()">
        <api-validate></api-validate>
        <fieldset>
            <legend>{{'label.heading.editclientAddress' | translate}}</legend>

            <div class="form-group">
                <label class="control-label col-sm-2">
                    {{'label.input.addresstype' | translate}}<span class="required">*</span>
                </label>

                <div class="col-sm-3">
                    <select chosen="addressType" id="addressId" name="addressType" ng-model="addressTypeId"  class="form-control"
                            ng-options="address.id as address.name for address in addressType" value="{{address.id}}" required late-validate>
                            <option value="">{{'label.menu.addressType' | translate}}</option>
                    </select>
                </div>
                <div class="col-sm-2">
                    <form-validate valattributeform="editaddressform" valattribute="addressType"/>
                </div>
            </div>

            <div class="form-group">
                <label class="control-label col-sm-2" for="houseNo">{{'label.input.houseno' | translate}}<span class="required">*</span></label>

                <div class="col-sm-3">
                    <input type="text" id="houseNo" name="houseNo" ng-model="formData.houseNo" class="form-control" required late-Validate/>
                </div>
                <div class="col-sm-2">
                    <form-validate valattributeform="editaddressform" valattribute="houseNo"/>
                </div>
            </div>

            <div class="form-group">
                <label class="control-label col-sm-2"  for="streetname">{{'label.input.streetname' | translate}}<span class="required">*</span></label>

                <div class="col-sm-3">
                    <input type="text" id="streetname" name="streetName" ng-model="formData.addressLineOne"  class="form-control" required late-validate/>
                </div>
                <div class="col-sm-2">
                    <form-validate valattributeform="editaddressform" valattribute="streetName"/>
                </div>
            </div>

            <div class="form-group">
                <label class="control-label col-sm-2" for="villagename">{{'label.input.villagename' | translate}}</label>

                <div class="col-sm-3">
                    <input type="text" id="villagename" ng-model="formData.villageTown"  class="form-control"/>
                </div>
            </div>

            <div class="form-group">
                <label class="control-label col-sm-2" for="talukname">{{'label.input.talukname' | translate}}</label>

                <div class="col-sm-3">
                    <input type="text" id="talukname" ng-model="formData.taluka"  class="form-control"/>
                </div>
            </div>

            <div class="form-group">
                <label class="control-label col-sm-2">
                    {{'label.input.countryname' | translate}}
                </label>

                <div class="col-sm-3">
                    <select chosen="countries" id="countryId" ng-model="formData.countryId" class="form-control"
                            ng-options="country.countryId as country.countryName for country in countries" value="{{country.countryId}}"
                            ng-change="changeCountry(formData.countryId)">
                            <option value="">{{'label.menu.selectCountry' | translate}}</option>
                    </select>

                </div>
            </div>

            <div class="form-group">
                <label class="control-label col-sm-2">
                    {{'label.input.statename' | translate}}
                </label>

                <div class="col-sm-3">
                    <select chosen="states" id="stateId" ng-model="formData.stateId"  class="form-control"
                            ng-options="state.stateId as state.stateName for state in states" value="{{state.stateId}}"
                            ng-change="changeState(formData.stateId)">
                            <option value="">{{'label.menu.selectState' | translate}}</option>
                    </select>

                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-sm-2">
                    {{'label.input.districtname' | translate}}
                </label>

                <div class="col-sm-3">
                    <select chosen="districts" id="districtId" ng-model="formData.districtId"  class="form-control"
                            ng-options="district.districtId as district.districtName for district in districts" value="{{district.districtId}}"
                            ng-change="changeDistrict(formData.districtId)">
                            <option value="">{{'label.menu.selectDistrict' | translate}}</option>
                    </select>
                </div>
                <form-validate valattributeform="editaddressform" valattribute="district"/>
            </div>

            <div class="form-group">
                <label class="control-label col-sm-2" for="pincode">{{'label.input.pincode' | translate}}<span class="required">*</span></label>

                <div class="col-sm-3">
                    <input type="text" id="pincode" name="pincode" ng-model="formData.postalCode"  ng-pattern="/^[0-9]+$/"  class="form-control" required late-validate/>
                </div>

                <div class="col-sm-2">
                    <form-validate valattributeform="editaddressform" valattribute="pincode"/>
                </div>
            </div>

            <div class="col-md-offset-5">
                <a id="cancel" href="#/viewclient/{{clientId}}">
                    <button type="reset" class="btn btn-default">{{'label.button.cancel' | translate}}</button>
                </a>
                <button id="save" type="submit" class="btn btn-primary"  ng-hide="blockUI" has-permission='UPDATE_ADDRESSES'>{{'label.button.save' | translate}}</button>
                <button class="btn btn-info" ng-show="blockUI"><strong>{{'label.button.processing' | translate}}</strong></button>
            </div>

        </fieldset>
    </form>

</div>