CKeditor does not accept special characters or diacritics in keywords

Recently, I came across a helpful code snippet for CKeditor that counts and ranks the most used words in a textarea. This feature is invaluable for generating SEO-keywords suggestions while writing articles. However, there is an issue with non-English characters like öäåÖÄÅ and Diacritics such as léjonet with é or ñ not being passed through some sort of filter.

Below is the HTML code along with a functioning Jsfiddle demo:

<!-- Textarea -->
<div class="form-group">
<label class="col-md-2 control-label" for="editor1">HTML </label>
<div class="col-md-10">                     
<textarea class="form-control" id="editor1" name="editor1"><p>text example with ahöäåra</p></textarea>
</div>
</div>

// More code snippets...

Additionally, JavaScript code has been included to address the diacritics removal function. If you encounter any issues related to this function affecting characters like öäåñ, the solution may lie in modifying or removing this specific function entirely.

If you would like to explore the full code and experiment with the functionality, feel free to check out the demonstration on JSFiddle:

DEMO

javascripthtmljquerycssckeditor

Answer №1

This particular line of code 

TextGrab.replace(/[^a-zA-Z ]+/g, "").trim()
serves the purpose of eliminating everything except characters from a to z, both in lower and upper case, as well as blank spaces. Any Unicode characters will be removed as a result. Therefore, it is advisable to either delete or comment out this specific line from the code.

On the other hand, the following line of code 

srctext.toLowerCase().split(/\W+/)
segments anything that does not fall within the range of a to z or 0 to 9. This means that the word ahöäåra would be split into ah and ra. Hence, consider replacing it with 
srctext.toLowerCase().split(/[^\p{L}\p{M}\p{N}]+/u)
.

Lastly, to remove the function referred to as removeDiacritics(), simply exclude it from your code altogether.

... (remaining content unchanged)

Due to iframe permission constraints on Stack Overflow, the aforementioned code may not run correctly here. For a functional demonstration, kindly refer to its performance on jsFiddle instead.

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

ajax response includes both a single variable as well as an array variable

My comment form requests newtimestamp and newcomment variables. The newtimestamp is a single variable, while the newcomment is an array generated from a foreach loop. A snippet from ajaxrequest.php: foreach ($array2 as $print2) { $var1 = $print2['va ...

phpjqueryarraysajaxjson

Why does the browser indicate that a GET request has been sent but the promise does not return anything?

Having trouble with a puzzling issue and unable to find any solutions online. I am attempting to make a basic HTTP get request to receive a JSON object from an API I created (using express+CORS). I have experimented with both Axios and VueResource, yet en ...

javascriptvue.jshttppromiseget

What is the best way to manage these interconnected Flexboxes when using align-items: stretch?

Trying to put this into words is quite challenging, so I created a simple diagram for better understanding: https://i.stack.imgur.com/TMXDr.png The outer parent uses flex with align-items:stretch to ensure that both col 1 and col 2 have the same height. ...

htmlcssflexbox

Issue: Anticipated the primary reducer to be a function, but was presented with: 'undefined' in Vanilla JS with Redux

Exploring the world of Redux, I decided to try out some code from a tutorial on YouTube. Building a simple Vanilla JS App, I integrated Redux into it. However, upon running the app in the terminal, an error message popped up saying: "Error: Expected the ro ...

javascriptnode.jsredux

Unable to alter the css of a jQuery object

I have been attempting to modify the CSS of two child elements of a specific element using Backbone and jQuery. However, my code does not seem to be working as expected. I suspect that the issue lies in distinguishing between a DOM element and a jQuery obj ...

javascriptjquerycssbackbone.js

I'm puzzled as to why my createDoorMethod is returning a string value instead of a number, even though I am passing it a number. Can someone help me

Currently enrolled in a web development course, I am diving into the world of Angular 2 and TypeScript. Despite following along with the video tutorial and using the same code, my implementation is not working as expected, leaving me puzzled. Here is the ...

javascriptangulartypescriptdeployment

Tips for maintaining the hash fragment of a URL when setting up Single Sign-On (SSO) with Shibboleth

I successfully integrated Single Sign-On (SSO) on a single-page application using the Shibboleth Service Provider. However, I encountered an issue where when a user tries to access a bookmarked URL with a hash value, the hash part of the URL is lost after ...

jquerysingle-sign-onsingle-page-applicationsamlshibboleth

Sending arrays in JSON format using Node.js Express (res.json)

I have a code snippet like this: app.get('/orders/:pizzeriaID/:status', async (req, res) => { try { const requestedOrderByPizzeriaID = req.params['pizzeriaID']; const requestedOrderByStatus = req.params['status']; ...

javascriptnode.jspostgresqlexpress

The primary container is brimming with an abundance of content

Can anyone help me with a CSS issue I'm experiencing in the latest versions of Chrome and Firefox? I can't seem to figure it out on my own. The problem arises with a container div that has a 50px top margin. Inside this container, there's a ...

htmlcss

What is the best way to link labels with input fields located separately in Angular?

Imagine a scenario where labels and form fields are being created in a *ngFor loop, as shown below: app.component.ts export class AppComponent { items = ['aaa', 'bbbbbb', 'ccccccccc'] } app.component.html <div class ...

javascriptangularformstypescript

React Intersection Observer not functioning properly

Hey there! I'm trying to create an animation where the title slides down and the left element slides to the right when scrolling, using the intersection observer. Everything seems to be fine in my code, but for some reason it's not working. Any t ...

javascriptcssreactjs

What is the best way to customize the MenuProps of Material UI Select component using createTheme?

I'm trying to update the dropdown menu style of my Material UI Select component using createTheme, but I'm having trouble getting it to work. Here is the code I have so far. Can you spot what might be causing the issue? import { createTheme } fr ...

cssreactjsmaterial-uifrontend

The synergy between ES6 arrow functions and array mapping techniques

I'm currently exploring shorthand methods of writing ES6 code and I've come across an example that has left me puzzled. The last shorthand used, "({length})", retrieves the length property of an array. While I understand how it works in this cont ...

javascriptarraysecmascript-6arrow-functions

Embed Text inside an HTML Canvas

As someone who is relatively new to working with html canvas, I am having a bit of trouble when it comes to containing text within the canvas area. Specifically, I am pulling text from a textarea and displaying it on the canvas, but it seems to stay as one ...

javascriptjqueryhtmlcanvas

Check to see if my Node.js server is running in development or production mode

Lately, I've been facing a tedious task every time I deploy a node.js server to my production server. It involves changing all the IP addresses, DNS settings, usernames, and passwords for my various connections to databases and external APIs. This en ...

javascriptnode.jsexpresscloud9-idejoyent

Tips for sending data from Ajax to another function

Can you assist me in understanding how to retrieve values from an ajax function and then use them in a different function? Here is an example: function getlanlon(){ $.ajax({ type: "GET", url: "{{URL:: ...

javascriptajax

"Customize your text alignment with TinyMCE's align

I'm in the process of updating from an outdated version of TinyMCE to the most recent release. In the old TinyMCE, if you inserted an image and aligned it to the left, the HTML generated looked like this: < img src="testing.jpg" align="left" > ...

javascripttinymcealignment

What could be causing the error message "CSRF token missing or incorrect" to appear?

I am facing an issue with returning a value from a View function in Django. This particular function is called from a JavaScript code using Ajax, but I'm encountering an error that says 'Forbidden (CSRF token missing or incorrect)'. JavaScr ...

javascriptajaxdjangopython-3.x

Utilizing JQuery version 1.8.0 to seamlessly send files through forms using AJAX technology

Initially, I believed this issue was related to CakePHP development. However, after receiving an answer, I discovered that it had wider implications. Here is the revised question to reflect the more general nature of the solution. I am working on a form ...

jqueryajaxformscakephpcakephp-2.3

Guide for positioning all navbar items except one to the left, beginning at the left edge, utilizing a set minimum and maximum width, while moving the final item to the right edge

Is there a way to align all items in a navbar except for one to the left, with a fixed combined minimum and maximum width of 300px-400px, while sending the last item to the right margin? I want the final result to resemble this: https://i.stack.imgur.com ...

htmlcss