Remove any extra space from the fields before sending an Angular post request

I am looking for a way to eliminate all whitespace from three fields (leading, trailing, and between characters) before they are sent to the backend via an Angular post request. The data is coming from the form data object. Currently, I have managed to achieve this by creating a custom deserializer for Jackson, but I would prefer to clean up the data before it reaches my Spring backend.

function insertNumber(form, result) {
    NumberSequence.save({"type": form.$name}, form.$data,
        success(result),
        error(form, result));
}

The data consists of 3 fields:

  • start
  • end
  • number

I need to strip whitespace from all three fields.

Does anyone have any suggestions on how to accomplish this?

javascriptangularjs

Answer №1

AngularJS offers a convenient ng-trim directive to achieve this functionality, please refer to the input directive documentation. Alternatively, if this solution does not meet your requirements, you can consider using a regular expression as recommended by @KyleK.

Answer №2

When starting your function:

for (let key in formData) {
    formData[key] = formData[key].trim();
}

You can also use the .trim() method, although it is not natively supported in versions prior to IE 9.

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

Python.Selenium. Unable to locate current element. Techniques for switching frames

I am trying to collect feedback from a specific page at this URL. After waiting for the page to load, I attempted to locate elements using Google Chrome inspector. However, Selenium is unable to find these elements, and I also could not find them in the p ...

javascriptpythonseleniumxpath

Utilizing Angular to intercept AJAX requests, verifying internet connectivity before proceeding with sending the request

In my Angular (with Ionic) app, I have this code snippet: my_app.factory('connectivityInterceptorService', ['$q', '$rootScope', function ($q, $rootScope) { var connectivityInterceptorServiceFactory = {}; var _request ...

javascriptangularjscordovaionic-framework

What steps can I take to establish a simple yet secure password authentication using next.js, mongoDB, and bcrypt?

As a hobby programmer working on my project, I aim to implement a secure password authentication system in my next.js project using only my next.js backend API and MongoDB (Atlas via Data API). I understand that there are various third-party authentication ...

javascriptnode.jssecuritynext.jsbcrypt

How can I implement a jQuery popup that prompts users to log in or register if they are not currently authenticated?

My JavaScript code includes jQuery and AJAX functionality for a specific action. Whenever a user id is not provided, and there isn't one stored in the session, I aim to prompt the user with a dialog box asking them to either register or log in. Could ...

javascriptjqueryajax

Struggling with getting React to successfully fetch data from an Express API. Any suggestions on how

I am having trouble with my fetch call to the express API. Even though I receive a response status of 200, I am still getting the index.html instead of the JSON data I need. Here is an overview of my setup: package.json "version": "1.0.0&qu ...

javascriptreactjsexpress

Guidelines for capturing a div screenshot with javascript

Let's say I have a div containing an image source. <div> <p class="row">With custom CSS</p> <img src="/images/midhun.jpg"> </div> When a button is clicked, I want to display a screenshot of this image in another div. C ...

javascriptjqueryangularjs

Inquiring about utilizing res.render and invoking functions within an EJS template

Exploring node, I created a practice function in a separate file and imported it to my server.js. With express as my framework, passing the function in the res.render object with a parameter works seamlessly. app.get('/projects', (req, res) => ...

javascriptnode.js

VueJS 3 is in the process of loading dynamic assets

I am facing an issue with loading and displaying images dynamically from the assets folder in my Vue.js project. The code I have written does not seem to work as expected: <img :src="getSource(data.thumbnail)" :alt="data.name"/> ...

javascriptnode.jsvue.jsvuejs3

Obtaining the dataItem of an edited cell in a Kendo grid

One issue I'm running into is retrieving the dataItem(row) when a cell in a column with a dropdown menu is updated. I've noticed that dataBind doesn't seem to be working as expected. In this project, I am utilizing Kendo Grid along with An ...

angularjskendo-gridkendo-dropdown

Navigating the ngCordova Facebook plugin: A step-by-step guide

Currently, I am working on incorporating a Facebook login feature into my Ionic app. I have decided to utilize the ngCordova Facebook plugin and have carefully followed all provided instructions. However, I am encountering an issue where I receive an error ...

angularjscordovaionic-framework

In a perplexing twist, requests made to the Express app arrive with empty bodies despite data being sent, but this anomaly occurs

Welcome to the community of inquisitive individuals on Stack! I'm facing an interesting challenge while developing an Express app. Despite everything running smoothly with two routes, I've hit a roadblock with one route that seems to have empty i ...

javascriptnode.jsexpressroutesrequest

Instructions on how to properly align a Youtube video using the react-youtube package

I'm currently encountering an issue with my YouTube video display. I have managed to make it responsive, but it is stuck on the left side of the screen and I am unsure how to center it properly. I tried adjusting the padding, but it didn't work a ...

javascripthtmlcssreactjs

Pass data from controller using Ajax in CodeIgniter

Here is my JavaScript code: $(document).ready(function(){ $("input[type='checkbox']").change(function(){ var menu_id = this.value; if(this.checked) var statusvalue = "On"; else var statusvalue = "Off"; $.ajax( ...

javascriptphpajaxcodeigniter

Unattractive destructuring during conditional assignment

When working with object properties, ESLint often suggests using object destructuring. However, this can sometimes result in redundant lines of code. ESLint may not allow something like the following (which might seem like the preferable approach): const ...

javascriptecmascript-6

Using JQuery to iterate through every unique div id in the HTML document

i am attempting to utilize jquery to iterate through each div tag that has an id of "rate". The goal is for jquery to execute a function on the individual divs. Here is my code snippet: information.html <html> <input class="rate" type="hidden ...

javascriptphpjqueryhtmlcss

Transmit a message from the background.js script to the popup window

Currently, I am looking to integrate FCM (Firebase Cloud Messaging) into my chrome extension. After conducting thorough research, I have discovered that the most efficient way to implement FCM is by utilizing the old API chrome.gcm. So far, this method has ...

javascriptvue.jsgoogle-chrome-extensionchrome-extension-manifest-v3

Adjust the scrollbar color when hovering over a particular div

Is there a way to change the color of a div's scrollbar when hovering over the div without assigning an id to it? I've attempted the following methods so far: div:hover { ::-webkit-scrollbar {color: black} } and div:hover + ::-webkit-scroll ...

javascriptcss

Iterating through a collection of items in Vue.js using the v

I am attempting to cycle through an object using v-for. exampleObject =[a,b,c,d] Requirement = display only a if it exists in exampleObject, otherwise show b, c, d. <div v-if="checklist.types"> <div v-for="type in checklist.t ...

javascriptvue.jsfor-loopvuejs2

How to assign various column values to a PHP array in JSON format from a MySQL database

I am struggling with making a JSON Ajax request and receiving an array in return. After browsing through multiple questions, I came across this code snippet that I edited to fit my problem: var hej[]; function ajax_search(){ $.getJSON('test.php ...

phpjavascriptmysqlarraysjson

Chrome and Firefox provide excellent compatibility for running JavaScript, whereas Safari may encounter some issues. Opera's performance with JavaScript can be quirky

Disclaimer: I'm new to web design and development. I have encountered an issue with posting information from a form built on CodeIgniter using jQuery. The form posts successfully in Chrome and Firefox, with the current page automatically reloading. H ...

javascriptjqueryformscodeignitercross-browser