FormValidation 1.2.0 what's new?

uri validator

Validate an URL address

Options

Using with form field

The HTML attributes are used to set the validator options via the Declarative plugin

Name HTML attribute Type Description
allowLocal data-fv-uri___allow-local Boolean Allow the private and local network IP. It is false, by default.
message data-fv-uri___message String The error message
protocol data-fv-uri___protocol String The protocols, separated by a comma. By default, it is set to http, https, ftp
allowEmptyProtocol data-fv-uri___allow-empty-protocol Boolean Allow the URI without protocol. Default to false

Using with JavaScript module


// You might need to change the importing path
import uri from 'formvalidation/validators/uri';

const result = uri().validate({
    value: ...,
    options: {
        allowLocal: ...,
        message: ...,
        protocol: ...,
        allowEmptyProtocol: ...,
    },
});
/*
result is an object of
{
    valid: true or false,
    message: The error message
}
*/

Basic Example

You can click on sample to see if it's a valid or invalid URL.

Sample Is valid?
http://foo.com/blah_blah
http://foo.com/blah_blah/
http://foo.com/blah_blah_(wikipedia)
http://foo.com/blah_blah_(wikipedia)_(again)
http://www.example.com/wpstyle/?p=364
https://www.example.com/foo/?bar=baz&inga=42&quux
http://✪df.ws/123
http://userid:password@example.com:8080
http://userid:password@example.com:8080/
http://userid@example.com
http://userid@example.com/
http://userid@example.com:8080
http://userid@example.com:8080/
http://userid:password@example.com
http://userid:password@example.com/
http://142.42.1.1/
http://142.42.1.1:8080/
http://➡.ws/䨹
http://⌘.ws
http://⌘.ws/
http://foo.com/blah_(wikipedia)#cite-1
http://foo.com/blah_(wikipedia)_blah#cite-1
http://foo.com/unicode_(✪)_in_parens
http://foo.com/(something)?after=parens
http://☺.damowmow.com/
http://code.google.com/events/#&product=browser
http://j.mp
ftp://foo.bar/baz
http://foo.bar/?q=Test%20URL-encoded%20stuff
http://مثال.إختبار
http://例子.测试
http://उदाहरण.परीक्षा
http://-.~_!$&()*+,;=:%40:80%2f::::::@example.com
http://1337.net
http://a.b-c.de
http://223.255.255.254
http://
http://.
http://..
http://../
http://?
http://??
http://??/
http://#
http://##
http://##/
http://foo.bar?q=Spaces should be encoded
//
//a
///a
///
http:///a
foo.com
rdar://1234
h://test
http:// shouldfail.com
:// should fail
http://foo.bar/foo(bar)baz quux
ftps://foo.bar/
http://-error-.invalid/
http://a.b--c.de/
http://-a.b.co
http://a.b-.co
http://0.0.0.0
http://10.1.1.0
http://10.1.1.255
http://224.1.1.1
http://1.1.1.1.1
http://123.123.123
http://3628126748
http://.www.foo.bar/
http://www.foo.bar./
http://.www.foo.bar./
http://10.1.1.1
http://10.1.1.254

HTML5 Example

When the Declarative plugin is used, the uri validator will be turned on automatically if the input uses HTML 5 type="url" attribute.

Using with regexp validator example

The following example is a combination usage of the uri and regexp validators. It asks user to enter a valid URL which ends with .jpg, .jpeg, or .png.

Module Example

The following snippet shows how to use the uri validator with JavaScript module:


// You might need to change the importing path
import uri from 'formvalidation/validators/uri';

const res1 = uri().validate({
    value: 'http://foo.com/blah_blah_(wikipedia)',
    options: {
        message: 'The input is not a valid URL',
    },
});
// res1.valid === true

const res2 = uri().validate({
    value: 'http://foo.bar?q=Spaces should be encoded',
    options: {
        allowLocal: true,
        message: 'The input is not a valid URL',
    },
});
// res2.valid === false

const res3 = uri().validate({
    value: 'news://foo.com/blah_blah',
    options: {
        allowEmptyProtocol: true,
        message: 'The input is not a valid URL',
    },
});
// res3.valid === true

Related validators

The following validators are similar to this one and might be useful to you.

Name Description
ip Validate an IP address. Support both IPv4 and IPv6
mac Validate a MAC address
← stringLength validator
uuid validator →