Determining special characters within a string using VueJS

As a newcomer to VueJS, I am currently developing an application that requires a signup and login system. My goal is to inform the user if they have entered a special character such as /[&^$*_+~.()\'\"!\-:@]/. In order to achieve this, I have implemented the use of the includes method in my signup.vue file. While includes works well with individual characters, it does not seem to function correctly with a string of characters. How can I address this issue?

var character = /[&^$*_+~.()\'\"!\-:@]/

if (this.name.includes(character) || this.lastname.includes(character)) {
   this.feedback = 'Special character present, please correct'
} 

Answer №1

This approach is effective

var specialChar = /[ `!@#$%^&*()_+\-=[\]{};':"\\|,.<>/?~]/

if (specialChar.test(this.name) || specialChar.test(this.lastname)) {
   this.message = 'There are special characters present, please revise'
} 

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

What steps are involved in creating a Vue app to integrate it into another application?

Embarking on my Vue development journey, I recently took on the challenge of creating an app in Vue. With a focus on using multiple components to ensure maintainability, I also made sure to install all necessary dependencies. However, I've hit a roadb ...

Having trouble using nuxt-link to navigate to an anchor/hash on another page

I am trying to implement a feature where I can navigate to a specific section of a page from another page using Nuxt.js. To achieve this, I added the scrollBehavior function in the router object within the nuxt.config.js file as shown below: router: { ...

Compatibility of Typescript with local storage

Can Typescript interact with local storage in any way? I have been setting items using the following code: localStorage.setItem('someString', JSON.stringify(MyTypescriptObject)); This method stores the object as a plain string. For example: ...

Mastering the art of using res.send() in Node.js

I have been working on a project using the mongoose API with Node.js/Express. There seems to be an issue with my get request on the client side as the data is not coming through. Can someone help me figure out what's wrong? Snippet of backend app.ge ...

turning off next.js server side rendering in order to avoid potential window is undefined issues

I am currently managing a private NPM package that is utilized in my Next.js project, both of which are React and Typescript based. Recently, I integrated a graph feature into the NPM package and encountered an issue where any reference to window within t ...

Vue component not displaying object property

I am currently working on implementing a filter method in a Vue component. Here is the filter method I am trying to use: filterHotels:function(){ var thisHotels = this.hotelRoomArr; console.log(this.hotelRoomArr['107572']['rooms ...

Can a faulty image be cached?

Is there a way to ensure that the browser caches invalid or broken images so that when they are re-fetched, the loading time is immediate? I am particularly interested in two scenarios: 1) The first scenario involves trying to load an image from a URL co ...

Error message: React Native encountered a prop type failure when an invalid prop of type array was passed to the Overlay component

I am brand new to React Native and encountering an error message when opening a specific component. Although it doesn't hinder navigation, I would like to resolve this issue. I suspect it could be related to a syntax or typo error, but pinpointing the ...

What is the best way to identify a specific AdWords account while utilizing campaignSelector within AdWords scripts?

I have been working on a script that aims to achieve the following tasks: Go through all the accounts in an MCC and pick out the ones with 'SEM' in their name. Go through the campaigns in a selected account and choose those that meet specific c ...

Bootstrap Tags Input - the tagsinput does not clear values when removed

I am attempting to manually remove the input value from bootstrap-tags-input when the x button is clicked, but the values are not changing in either the array or the inputs. This is the code I have tried: $('input').tagsinput({ allowDuplica ...

Sending the chosen option from a Vue.js DropDown menu to the database for storage

One issue that I am facing is the inability to add the selected value from a DropDown list (in Vue.js) to an array for saving it in the database. However, I can retrieve the value and pass it to an alert for testing purposes. Here is the code snippet: &l ...

"After completing the survey form, the User Details form is displayed upon clicking the submit button

In my Quiz, each question loads on a separate page with clickable options. Some questions may have multiple answers, including an "Others" option. At the end of the quiz, users need to fill out a form. Although I've created a survey form, I'm fa ...

How can one retrieve every element within nested associative arrays?

Situation : Upon receiving a JSON array from a jQuery <-> PHP Ajax request, the unparsed JSON array structure appears as follows: {"Focus":{"id":2,"brand":"Ford","name":"Focus"}} Upon using JSON.parse(json);, the structure transforms to: Foc ...

Transitioning from curl to jQuery's $.ajax() method

Recently, I encountered a challenge while trying to switch the curl code used for an API known as TextRazor to jquery's AJAX due to certain limitations on the platform. Despite exploring various solutions suggested by the community in response to simi ...

React JS functionality does not support Bootstrap tooltips

I'm attempting to implement a tooltip in my React app, but I'm experiencing issues with it not displaying properly. I am utilizing vanilla Bootstrap for this purpose. I've included the following script tag in my index.html file to import the ...

Enhance your dynamic content with jQuery/AJAX through customized CSS styling

Below is the jquery (3.1.1)/ajax request that I am using: $.ajax({ type: "POST", url: "pref.php", dataType: "text", data: { groupe_id: groupe_id, action: "getProducts" }, cache: false, error: function(html){ ...

Formatting Dates in Node.js

Can someone assist me in understanding how to properly format the print date shown below? Thu Sep 06 2018 18:18:26 GMT+0530 I attempted to use console.log(new Date()) However, the output generated was 2018-09-06T12:48:25.776Z I am unsure of how to co ...

Looking to transform a list into JSON format using JavaScript?

I have a collection that looks like this: <ol class="BasketballPlayers"> <li id="1">Player: LeBron, TotalPoints: 28753, MVP: true</li> <li id="2">Player: Steph, TotalPoints: 17670, MVP: true< ...

Retrieve a selection of data from the data.json file and mix it up

My webpage has a json data sheet containing multiple objects that I am currently showcasing. { "objects": [ ... ] } In terms of templating: $(function () { $.getJSON('data.json', function(data) { var template = $('#objectstpl') ...

Issue with Vue 3: Unable to scroll as there is no scrollbar appearing in the browser

When using multiple v-for loops to create divs larger than my screen in Firefox or Chrome, I notice that there is no scrollbar. This causes the divs to be cut off and only part of them is visible. Could it be a Vue-related issue? View Example: Lot of Dat ...