Website validation in AngularJs

Question

I have a field that accepts a URL. How do I validate this URL in angularjs.

<div class="controls">
   <input type="text" ng-model="controller.data.PropertyWebsite"/>
</div>

Any ideas and suggestions are appreciated !!!!

Answer 1

Add a html input[url] to a form and mark it as required, then use angular to check if the form is valid or not:

html:

<form name="form">
    <tr>
        <td><input type="url" name="url" required></td>
    </tr>
    <tr>
        <td><button type="submit" ng-click="SubmitForm('form')">submit</button>                                    </td>
    </tr>
</form>

controller:

$scope.submitForm = function () {

    if (this.form.$invalid)
        //not valid
    } else {
        //valid
    }
}

More information about url input: https://docs.angularjs.org/api/ng/input/input%5Burl%5D

Answer 2

You can use ng-pattern to validate against a RegEx. https://docs.angularjs.org/api/ng/directive/input