The regular expression for email validation does not accurately verify the portion following the period

I'm currently working on validating email addresses in my HTML page using an Angular directive.

From my perspective, a valid email address looks like this:

[email protected]

The regular expression I've been using allows for email addresses like "hello@mycompany."

What kind of regular expression could I implement to require the ".com" part of an email address, ensuring that there is a "." followed by any characters?

I have searched the internet and tried various regular expressions listed, but none seem to be effective.

<div class="form-group" ng-class="{ 'has-error': registerUpdateForm.Email.$invalid }">
    <label class="col-sm-3 control-label" for="Email">Email Address</label>
    <div class="col-sm-9">
        <input required type="email" data-ng-model="auth.Email"
               data-ng-pattern="^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,4})$"
               id="email" name="Email" class="form-control" />  <!--ng-pattern="matchPattern"/-->
    </div>

</div>

Answer №1

When working with regular expressions in JavaScript, it is important to ensure that the pattern is wrapped in forward slashes like /pattern/. The regular expression provided seems correct, so make sure to include the forward slashes at the beginning and end:

<input required type="email" data-ng-model="auth.Email"
               data-ng-pattern="/^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,4})$/"
               id="email" name="Email" class="form-control" /> 

For a demonstration, you can check out this Plunker link.

Answer №2

According to the W3C guidelines, the specified regex for validating email addresses is stated as:

/^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/

A potential pattern for validation could be (not tested):

/^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+\.com$/

It's important to note that limiting the top-level domain to {2,4} characters may not be feasible anymore if you wish to accommodate domains beyond ".com". More information on proposed domains can be found here.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

The reason why the script and div tags are so common in HTML is because they serve different purposes. However, it's

Hey there, friend! I've searched on baidu.com, cnds, and stack overflow, but couldn't find an answer. I have two questions: "why can script and div tags be used so much in HTML?" and "why is there only one html and body tag in HTML?" For example: ...

The JQuery-AJAX script in my Django application, intended to show a preset value in a calculated field, is not functioning as expected

Here are a couple of models from my project: class Package(models.Model): patient=models.ForeignKey(Patient, on_delete=CASCADE) diagnosis=models.ForeignKey(Diagnosis, on_delete=CASCADE) treatment=models.ForeignKey(Treatment, on_delete=CASCADE) ...

Transferring data as a JSON object from PHP to JavaScript

My PHP file is named page.php <?php $php_variable = $_GET['param1']; $uv = str_replace("{ZIP Code}", $php_variable,'http://iaspub.epa.gov/enviro/efservice/getEnvirofactsUVDAILY/ZIP/{ZIP Code}/JSON'); $homepage = file_get_contents($u ...

Error: The Object #<Object> does not contain a function named 'Schema'

Below is the user model schema that we are using. However, when I try to run it on my localhost, I encounter an error: TypeError: Object # has no method 'Schema' // app/models/user.js // Required modules var neo4j = require('neo4j'); ...

Discovered an issue with Sentry debugging where a lengthy string is being returned as undefined

We are currently in the process of developing an Angular 1.x application that utilizes Bootstrap components. Recently, we integrated Sentry debugging into our site and encountered the following error: 'PAPADDINGXXPADDINGPADDINGXXPADDINGPADDINGXXPADDIN ...

How can we initiate the AJAX request right away while also making sure the page is fully loaded before adding

One trick I've discovered is that by submitting an AJAX request in the <head> section of my webpage, I can avoid a minor flicker on page load when loading content via AJAX. Of course, this method still needs some refining to handle longer AJAX r ...

The eel feature results in no output

During my Python program development using the Eel module, I encountered an issue. The problem is that the eel.getImgSrc(path) function returns null when trying to retrieve image's byte data. Take a look at this example: -----web/main.js------ async ...

Creating a form in PHP with the power of JavaScript, AJAX, and jQuery

I have successfully created a registration form using HTML, processed the data with PHP, and utilized javascript, ajax, and jquery. However, I am facing an issue where I want to display a notification stating whether the operation was "inserted/failed" on ...

Learn how to create a clickable div that redirects to a URL in Angular JS

Forgive me if this question is basic, but as I delve into learning Angular JS, I encountered an issue. My goal is to create a clickable div that redirects to another page when clicked, but my current implementation isn't working... ...

Ways to retrieve information from a callback method

Struggling to access the data returned from the getChildren method in the caller function. The code snippet below shows my predicament: I've implemented these functions within a controller and provided all necessary objects var baseMethod = function ...

Using JQuery to fill an HTML dropdown menu with data from a JSON file

I've been struggling with this issue for a while and despite reading through other posts, I still can't seem to get it to work. My problem lies in populating a drop down menu with JSON data. Although the drop down menu appears on my HTML page, i ...

JavaScript's Use of Brackets

I’ve been working on a new project that involves adding links. To do this, users can input both the link URL and the text they want displayed. I used a prompt to gather this information. Here’s the code snippet I wrote: document.getElementById(ev.targ ...

Unable to transfer data through Ionic popover

I've encountered an issue when trying to pass data to my popover component, as the data doesn't seem to be sent successfully. Code HTML <div class="message" id="conversation" *ngFor="let message of messages.notes"> <ion-row class= ...

Issue with redirecting to another link in Angular routing

After numerous attempts, I finally managed to configure the adviceRouterModule correctly. Despite extensive research and Google searches, I couldn't quite crack it. Here is the configuration for my AdviceRoutingModule: const adviceRouters: Routes = ...

Ways to connect a click event to a dynamically generated child element with the help of jQuery?

I am aware that similar questions have been asked elsewhere, but as someone new to jQuery, I am still struggling to attach a click listener to an a element within a dynamically appended ul.li.a structure in the DOM. Below is an example of how the structure ...

The value of "asp-route-id" is dynamically determined through the use of

Hey there, I’m looking to dynamically pass a value from "codeDrink" to my controller using "asp-route-id" and Ajax in my ASP.NET MVC project. This is how I am handling it in my view: <p> <a id="deleteLink" asp-action="Delete& ...

What is the best method for assigning a default value to the file input tag in HTML?

Can anyone help me with this code snippet? <input name="GG" type="file" value="< ?php echo $data['image'] ?>"> I was trying to set a default value in the form edit, but it seems to not be working. Does anyone know how to set a defau ...

Tips for repositioning a node element as the first child within its parent element

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id='parent'> <div>B</div> <div>C</div> <div onload='this.parentNode.prependChild();'>A&l ...

Execute the strace command using the child_process module in Node.js

Having received no answers and being unsatisfied with the previous approach, I am now attempting a different method to monitor the output of a program that is currently running. Inspired by a thread on Unix Stack Exchange, the goal is simply to retrieve th ...

What is the best way to locate every object based on its ID?

Currently, I am facing an issue where I have a list of IDs and I need to search for the corresponding object in the database. My tech stack includes Nodejs, Typescript, TypeORM, and Postgres as the database. The IDs that I am working with are UUIDs. ...