Transforming specific symbols (é è ë) with URL encoding

I am currently working on a JavaScript function that opens the user's email client with pre-filled content.

However, I am facing difficulties in converting special characters so they display correctly in the email client (especially when passed through a URL).

After writing a function and using console.log(), it seems that the character conversion is not happening properly (possibly due to attempting to replace a char with a string).

function url_encode(item)
{
    for (i in item)
    {
        a = item[i]
        switch (a)
        {
            case "À": a='%C0';
            break;
            case "È": a='%C8';
            break;
            case "É": a='%C9';
            break;
            case "Ê": a='%CA';
            break;
            case "à": a='%E0';
            break;
            case "è": a='%E8';
            break;
            case "é": a='%E9';
            break;
            case "ê": a='%EA';
            break;
            case "ë": a='%EB';
            break;  
        }
        item[i] = a;
        console.log(item[i])
    }
    return item;
}

If anyone has discovered a successful method or has any insights (or solutions) on why this may not be functioning as expected, please share!

Edit: The encodeURI function does not correctly handle é and è characters (commonly used in French), resulting in é and è.

javascriptfunctionurlencode

Answer №1

Is this acceptable?

function encode_URL(url) {
    return url.split('').map(function(c) {
        return /[ÀÈÉÊàèéêë]/.test(c) ? '%' + c.charCodeAt(0).toString(16).toUpperCase() : c;
    }).join('');
};

Check out the live demo here: http://jsfiddle.net/x8Jh4/

(Please note: If you are using IE8, you will need to polyfill for the .map() function.)

Example Usage:

encode_URL('ABCÀDEFè') // "ABC%C0DEF%E8"

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

405 status code returned for CORS request

Hello everyone, I need assistance with my CORS issue. I am trying to make an API request from another domain and encountering an error with the following code: var headers = { host: host, path: url + instance + '?action=reset', ...

javascriptajaxresthttp-status-code-502

Guide on adding a timestamp in an express js application

I attempted to add timestamps to all my requests by using morgan. Here is how I included it: if (process.env.NODE_ENV === 'development') { // Enable logger (morgan) app.use(morgan('common')); } After implementing this, the o ...

javascriptnode.jsexpressmean-stacknode-modules

Creating a personalized instance function in Angular's $resource

When working with AngularJS, all actions for a $resource are added as $customAction methods to the Resource. This allows me to easily invoke them as methods on resource instances. For example: var User = $resource('/user/:userId', {userId:' ...

javascriptangularjs

Using JavaScript to create a dynamic to-do list that persists on the browser even when refreshed

I created a Javascript Todolist that is functioning well, but I am seeking a way to ensure that my Todo-items persist on the browser even after refreshing until I choose to delete them. Any suggestions or advice on how I can achieve this? ...

javascript

The Express/Mongoose route consistently modifies the identical item

I'm encountering an issue where any attempt to update or create a new item results in only creating one item and then updating that same item regardless of the input. Is there something incorrect with this route? // @route POST api/item // @desc ...

javascriptnode.jsexpressmongoose

What is the method for inserting a line break into a string that is being transferred to a component in Next JS?

I am currently collaborating on a group project that involves developing a website. One of my team members created a ContentBlock component to facilitate the creation of new pages (see component code below). I have been working on a new page for the site a ...

javascriptnext.js

Guide to conditionally adding a property to an object in JavaScript

After scouring both Stack Overflow and Google for a solution, I finally stumbled upon this brilliant idea: x = { y: (conditionY? 5 : undefined), z: (conditionZ? 5 : undefined), w: (conditionW? 5 : undefined), v: (conditionV? 5 : undefined), u ...

javascriptnode.jsexpress

Employing a "cross-domain" approach to serve as a login gateway for a different domain

I need to configure the domain: aaaa.com so that it can host a login form for the website located at domain: cccc.com. It's important to note that I have complete control over the server at cccc.com and have successfully set up CORS on that server. A ...

c#javascriptjqueryasp.net-mvcasp.net-mvc-3

Struggling to pass Chai tests with Node and Express.js when trying to handle POST requests

Working through a Chai testing exercise and struggling to pass the POST route tests. Encountering two specific errors: 1) Todo API: POST /v1/todos Issue with creating and returning new todo using valid data: Header 'location' should ...

javascriptnode.jsrestexpresschai

How to implement setState within a Promise function using useEffect in React functional components with hooks?

I am struggling to set the value of a hook within a Promise function inside a useEffect(), and then store the returned promise value in the fruit hook so that it can be accessed in the return function of MyComponent() This is what I have attempted so far: ...

javascriptreactjspromisereact-hooks

Invalid component exception: The element type is not valid in React Native

In my React Native App.js file, I have included the following code snippet import { StatusBar } from 'expo-status-bar'; import React, { useRef } from 'react'; import { StyleSheet, Text, View, Canvas } from 'react-native'; impo ...

javascriptreactjsreact-native

Using Selenium Webdriver to set a cookie with a Chrome extension

I have been experimenting with a Chrome extension in order to set a cookie when I use a Selenium Webdriver instance to open a page. Despite trying various methods suggested on different Stack Overflow posts, none of them seem to work as the cookie does not ...

javascriptgoogle-chromeselenium-webdrivergoogle-chrome-extension

Displaying JSON keys and values individually on an HTML page

Looking to display a JSON array in HTML using ngFor TypeScript : import { Component, OnInit } from '@angular/core'; @Component({ selector: 'app-ng-for', templateUrl: './ng-for.component.html', styleUrls: ['./ng-for ...

javascripthtmlangular

Arranging an Array Object in Javascript by Date

Although similar questions have been addressed in other posts, my specific situation appears to be unique due to the data I am receiving from Twitter. Here is the logic I am currently using to sort the JavaScript Array object. However, the issue seems to ...

javascriptjquerytwitter

Create a dynamic process that automatically generates a variety of div elements by using attributes from JSON data

Is there a way to organize the fixtures from this data into separate divs based on the matchday attribute? I've tried using Underscore's groupBy function but I'm unsure how to dynamically distribute the data into individual divs for each re ...

javascriptjqueryarraysjsonunderscore.js

Leveraging NodeJS to handle server-side tasks and operations

Background: I am exploring the use of NodeJS for a project that involves scraping and storing content in Mongo. This process needs to be automated according to a set schedule. In addition, I need functions that can extract items from the Mongo database, o ...

javascriptnode.jsexpressweb-scrapingserver-side

What are the steps to incorporate PointerLockControl in Three.js?

Having trouble correctly integrating the PointerLockControl in Three.js? Despite trying various examples, errors seem to persist. I've been importing libraries through the head part like this: <script src="lib/controls/PointerLockControls.js"> ...

javascriptthree.jspointerlock

What could be causing the issue with uglify not functioning properly with AngularJS content?

I've created some gulp tasks to assist in building my web project. One of the tasks involves minifying js files. Here is the task code snippet: gulp.task('minify' , function() { console.log('Copy minified js '); return gulp ...

javascriptangularjsgulpgulp-uglify

[Vue alert]: "Maximum" property or method is not declared in the instance but is being referenced during the rendering process

Here is my custom Vue component: Vue.component("product-list", { props: ["products", "maximum-price"], template: ` <div> <div class="row d-flex mb-3 align-items-center p-3 rounded-3 animate__animate ...

javascripthtmlvue.jsfrontendcomponents

The functionality to redirect in Wordpress Contact Form 7 based on the value of a radio button selection does

For the past 5 hours, I have been diving deep into Contact Form 7 redirects that are based on values. Despite my efforts, I am unable to figure out why my code isn't functioning properly. Is there anyone who can spot the issue? Contact Form Radio But ...

javascriptphpjquerywordpressforms