How can we validate the URL'S links in java script - javascript

I wrote the code for form field validation in JavaScript,
but it's not working properly as my requirement.
URLs only support:
http
https://
and (www.xyz.com , xyz.com ,xyz.co.in )
My code :
var file_url = document.getElementById(url);
if(file_url.value.match(^(http:\/\/www\.|https:\/\/www\.|http:\/\/|https:\/\/)[a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[a-z]{2,5}(:[0-9]{1,5})?(\/.*)?$)){
alert('Please Enter valid Url');
return false;
}
but it does not work as expected

^(http:\/\/www\.|https:\/\/www\.|http:\/\/|https:\/\/)?[a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[a-z]{2,5}(:[0-9]{1,5})?(\/.*)?$
Try this.See demo.
https://regex101.com/r/tX2bH4/58

After many trails i got this one better,I have tried this one working perfectly.I think this one also correct one.
if(!file_url.value.match(/(^|\s)((https?:\/\/)?[\w-]+(\.[\w-]+)+\.?(:\d+)?(\/\S*)?)/gi)){
alert('Please Enter valid Url');
return false;
}
Here is the demo: Demo of regex

Related

How to validate Text Box to allow Specific URI?

i am developing application using Code-igniter.
I want to validate Text Box Using J Query Or JavaScript That only allowed to input following URL when user submit form.
http://
https://
ftp://
ftps://
file://
market://
linkedin://
fb://
geo:
maps://
Is there any way to do this ?
function is_url(str)
{
regexp = /^(?:(?:https?|ftps?|file?|market?|linkedin?|fb?|maps?):\/\/)?(?:(?!(?:10|127)(?:\.\d{1,3}){3})(?!(?:169\.254|192\.168)(?:\.\d{1,3}){2})(?!172\.(?:1[6-9]|2\d|3[0-1])(?:\.\d{1,3}){2})(?:[1-9]\d?|1\d\d|2[01]\d|22[0-3])(?:\.(?:1?\d{1,2}|2[0-4]\d|25[0-5])){2}(?:\.(?:[1-9]\d?|1\d\d|2[0-4]\d|25[0-4]))|(?:(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)(?:\.(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)*(?:\.(?:[a-z\u00a1-\uffff]{2,})))(?::\d{2,5})?(?:\/\S*)?$/;
if (regexp.test(str))
{
return true;
}
else
{
return false;
}
}
Try using this regex in a function that checks validity of your input.
/^(http|https|ftp|ftps|file|market|linkedin|fb|maps|geo):\/\//g
But do the reverse logic:
if it matches then display error mesage and clear input.
If it not matches then your URL is fine
If you wanna prevent URLs anywhere in your input, remove the leading ^ in regex to match even if URL is not start of the string.
like: /(http|https|ftp|ftps|file|market|linkedin|fb|maps|geo):\/\//gm
Here is a crud version of entire solution:
fiddlejs
Main thing is URL validation:
$("#urlInput").focusout(function (){
var inputElement = $("#urlInput");
var regexp = /(http|https|ftp|ftps|file|market|linkedin|fb|maps|geo):\/\//gm;
if (regexp.test(inputElement.val())){
inputElement.val("");
alert("This is nto a valid URL")
}
});
It bound to the
<input id="urlInput" type="url">
You might wanna rework the error reporting in a more user friendly manner but that's another story.

Regex URL validation for angularjs

I'm trying to create validation for URL which will accept the following cases
with HTTP or https or without, with www or without, with subpages or without
http://website.com
https://website.com
http://website.com/
http://www.website.com
website.com
http://website.com/page/id/sdf
I tried the following, but it did not cover all cases above
$scope.urlPattern = '^(([a-z]+[.])?[a-z0-9-]+([.][a-z]{1,4}){1,2}(/.*[?].*)?$'
$scope.urlPattern = '^((https?|ftp)://)?([a-z]+[.])?[a-z0-9-]+([.][a-z]{1,4}){1,2}(/.*[?].*)?$'
I do not have permission to add a comment, So I am editing for my answer only. Below link has all type of URL validation, hope it will help you:
All type URL validation link
If you just want to validate the url, you don't really need to concern the 'www' condition (since it is included in other condition)
Something simple can be done like this:
'^(https?:\/\/)*[a-z0-9-]+(\.[a-z0-9-]+)+(\/[a-z0-9-]+)*\/?$'
JSFiddle:
https://jsfiddle.net/q0d69jq3/2/
var result = url.match(/(http(s)?://.)?(www.)?[-a-zA-Z0-9#:%.+~#=]{2,256}.[a-z]{2,6}\b([-a-zA-Z0-9#:%+.~#?&//=]*)/g);
if (result == null) {
return false;
}
return true;
};

Link/HREF Validation using jQuery or Javascript and RegEx

I have an input form where users can fill out a profile for their internal tool that they are submitting. There is a link field that allows the user to enter a link to this tool.
The following formats are accepted:
http://
https://
file://
\\server\path\to\file.txt
W:\
I am trying create a javascript function to validate the input to make sure it is in one of the above mentioned formats.
I have found some generic URL validation regEx strings but none of them seem to include the local paths of files.
Here is a quick example of a function that works just fine for the top 2 needed formats but when it comes to network paths, I can't find anything that I can get integrated into one easy function.
var message;
var myRegExp =/^(?:(?:https?|ftp):\/\/)(?:\S+(?::\S*)?#)?(?:(?!10(?:\.\d{1,3}){3})(?!127(?:\.\d{1,3}){3})(?!169\.254(?:\.\d{1,3}){2})(?!192\.168(?:\.\d{1,3}){2})(?!172\.(?:1[6-9]|2\d|3[0-1])(?:\.\d{1,3}){2})(?:[1-9]\d?|1\d\d|2[01]\d|22[0-3])(?:\.(?:1?\d{1,2}|2[0-4]\d|25[0-5])){2}(?:\.(?:[1-9]\d?|1\d\d|2[0-4]\d|25[0-4]))|(?:(?:[a-z\u00a1-\uffff0-9]+-?)*[a-z\u00a1-\uffff0-9]+)(?:\.(?:[a-z\u00a1-\uffff0-9]+-?)*[a-z\u00a1-\uffff0-9]+)*(?:\.(?:[a-z\u00a1-\uffff]{2,})))(?::\d{2,5})?(?:\/[^\s]*)?$/i;
var urlToValidate = "\\server.domain.com\path\file.txt";
if (!myRegExp.test(urlToValidate)){
message = "Not a valid URL.";
}else{
message = "Its a valid URL.";
}
alert(message);
JS Fiddle: https://jsfiddle.net/carlhussey/ebg4m278/
I am looking for a solution to validate the standard web protocols as well as network/file shares.

Javascript Regex to validate URL and Empty at the same time

I tried to write a regular expression to work with the position-absolute jQuery validation plugin to give error if the string is left empty OR its a invalid URL. It works well for the URl but doesn't give error if a empty string is there . Here's the regex
"regex": /^\S$|^(http[s]?:\/\/){0,1}(www\.){0,1}[a-zA-Z0-9\.\-]+\.[a-zA-Z]{2,5}[\.]{0,1}/,
Can somebody tell what's wrong in the regex?
EDIT:
I'm using this plugin for jQuery validation
Demo: Go to this URL and in the URL validtion section, remove HTTP and see the error messages
http://www.position-relative.net/creation/formValidator/demos/demoValidators.html
When I add required and URL validators together, it shoots 2 errors. But with only URL
validator, it doesn't say that its a Invalid URL. I just need 1 error for both Empty and
Invalid URL.
https://github.com/posabsolute/jQuery-Validation-Engine
Thanks
You can set the same generic error message for all errors using data-errormessage, so regardless of whether the field is empty or has an invalid value you will get the same message.
have you tried jQuery URL validation metohod ?
I wrote a small example how you could validate a email realy quick and easy. Without the hassle of using a plugin. If you use it just once you could just use
var emailaddressVal = 'nobody#example.cpom';
var emailReg = /^([\w-\.]+#([\w-]+\.)+[\w-]{2,4})?$/;
if(emailReg.test(emailaddressVal) && emailaddressVal.length > 0)
{
alert('Your email is valid.');
}
else
{
alert('The email is invalid')
}
However putting it in a function so you could use it multiple times. than put it in a function for example:
// Email check function
function checkEmail(email)
{
var emailReg = /^([\w-\.]+#([\w-]+\.)+[\w-]{2,4})?$/;
if(emailReg.test(email) && email.length > 0)
{
return true;
}
else
{
return false;
}
}
// Ussage
if(checkEmail('nobody#example.com'))
{
alert('SUCCESS!!');
}
else
{
alert('FAILED!!');
}

How to check form input in html form control

I have an html file which contains a form. There is lots of text typed input control need customer to input information. How do I check whether the customer's input is correct?
For example, I want to check if the username only contains digits, letters and '_'.
Please help me.
I'd appreciate if somebody can provide me a demo.
Thanks in advance!
Here’s one possible approach, for a simple task like the one given as example:
<script>
function check(elem) {
if(elem.value.match('^' + elem.getAttribute('pattern') + '$')) {
return true;
} else {
alert(elem.getAttribute('data-msg'));
return false;
}
}
</script>
<input name=username pattern=[a-zA-z0-9_]{1,9} onblur=check(this)
data-msg="The user name may only contain letters A–Z, digits, and underlines and must be 1 to 9 characters.">
The idea here is to start with the HTML5 pattern attribute, specifying the allowed pattern of data as a regular expression. It already works on several modern browsers and does no harm when it doesn’t. Then you add an event attribute, which causes a JavaScript-driven check to be made, using the regular expression taken from the same attribute (with a prefix and postfix character added so that the check is made on the input item as a whole).
You may wish to display the error message in some less disruptive manner than via alert()
<input type="text" id="username" />
<span id="invalidMessage" style="display:none; color:Red"><img src="../../Images/error.gif" alt="OK" />invalidEmail。</span>
<script type="text/javascript">
$(document).ready(function() {
$('#username').blur(function() {
$('#invalidMessage').hide();
if ($('#username').val() != "") {
var email = /_*\w+(-?\w+)*#_*\w+(-?\w+)*(._*\w+(-?\w+)*)*.\w*/;
if (!email.test($('#username').val())) {
$('#invalidMessage').show();
}
}
});
});
</script>
There is a demo,hope can help you.
I would use something like this on the client side;
<script type="text/javascript">
<!--
function validate_form ( )
{
valid = true;
if ( document.contact_form.contact_name.value == "" )
{
alert ( "Please fill in the 'Your Name' box." );
valid = false;
}
return valid;
}
//-->
</script>
Then, i would use more robust error checking on the server side to ensure you have valid data. If you can catch bad data at the client, its a plus, as it avoids the hit on the server, but the validation really belongs on the data on the server side, as its more secure and can be reused by other forms.

Categories