Determine whether a given string is a valid URL and contains content

Question

Determine whether a given string is a valid URL and contains content

Is there a way to ensure that one of the input fields is not empty and that the #urlink follows the format of a URL before executing this function in JavaScript?

$scope.favUrls.$add

I'm uncertain about how to approach this.

html

<input type="text" id="urlName" class="form-control" placeholder=""  ng-model="mvName" />
<input type="text" id="urlLink" class="form-control" placeholder=""  ng-model="mvUrl" />

app.js

$scope.saveToList = function(event) {

    var mvName = $scope.mvName.trim();
    var mvUrl = $scope.mvUrl.trim();

          if (mvName.length > 0) {
            $scope.favUrls.$add({
              name: mvName,
              title: mvUrl
            });
              urlName.value = ''; //urlName is the ID of  input box - Angular rocks!
            urlLink.value = ''; //urlName is the ID of  input box - Angular rocks!
          }

}

javascript angularjs

Answer 1

Answer №1

Here is a function that can be used to validate URLs:

function ValidURL(str) {
  var pattern = new RegExp('^(https?:\/\/)?'+ // protocol
    '((([a-z\d]([a-z\d-]*[a-z\d])*)\.)+[a-z]{2,}|'+ // domain name
    '((\d{1,3}\.){3}\d{1,3}))'+ // OR ip (v4) address
    '(\:\d+)?(\/[-a-z\d%_.~+]*)*'+ // port and path
    '(\?[;&a-z\d%_.~+=-]*)?'+ // query string
    '(\#[-a-z\d_]*)?$','i'); // fragment locater
  if(!pattern.test(str)) {
    alert("Please enter a valid URL.");
    return false;
  } else {
    return true;
  }
}

source

Answer 2

Here is a function that can be used to validate URLs:

function ValidURL(str) {
  var pattern = new RegExp('^(https?:\/\/)?'+ // protocol
    '((([a-z\d]([a-z\d-]*[a-z\d])*)\.)+[a-z]{2,}|'+ // domain name
    '((\d{1,3}\.){3}\d{1,3}))'+ // OR ip (v4) address
    '(\:\d+)?(\/[-a-z\d%_.~+]*)*'+ // port and path
    '(\?[;&a-z\d%_.~+=-]*)?'+ // query string
    '(\#[-a-z\d_]*)?$','i'); // fragment locater
  if(!pattern.test(str)) {
    alert("Please enter a valid URL.");
    return false;
  } else {
    return true;
  }
}

source

Determine whether a given string is a valid URL and contains content

Answer №1

Similar questions

Is it possible to include spaces in a JavaScript alert message?

Reloading the ASP.NET MVC bootstrap modal using Ajax for a fresh look

Styling div elements to match the dimensions of table rows in CSS

Detecting the presence of a mobile keyboard on a website: strategies and techniques

JSP form continues to submit despite JavaScript validation returning false

What is the best way to ensure a function waits for a stable database connection before proceeding?

Looking to tilt text at an angle inside a box? CSS can help achieve that effect!

Adding up the values of an array of objects by month using ReactJS

Utilize the power of AJAX and Laravel to seamlessly upload an Excel file

Rotating an object in Three.js: Animate back and forth along two different azimuth angles

Problem with exporting data from the API to a JavaScript file in Excel format

Having trouble getting your Bootstrap v4 carousel to function properly?

Issue with Material UI Tab component not appearing in the first position

Configuring the baseUrl for Axios in a Vue.js application triggers the sending of a request

Create and store a new data entry in the custom taxonomy of a specific post

Define JSON as writeable: 'Error not caught'

What is the best approach to conceal elements from the main template in Meteor using a template event?

Add an error message to my throw object within the JSON response

The path NPM Package is missing in the package export

The presence of certain characters is leading to problems in the console