CODEWITHSUNDEEP
javascripthtml
LarryBud
LarryBud

Reputation: 1071

Prevent Smart Quotes on HTML5 Input

Had an annoying issue with my web application more recently. Using HTML5, a user can create an account with a login ID. The ID can contain pretty much any character. A user will enter an account ID, for example

Bob'sAccount

And their device (unknown to them) turns the ' into a "smartquote" with the ` style apostrophe

So now their account is created (with a smartquote in the user ID). However, if they try to log in using a device which doesn't automatically create smart quotes, they try to log in using the standard apostrophe, and since it's a different character, their account is not found.

I'm sure I could limit the characters a user can enter for an account ID, but I would rather just prevent the smartquotes from happening in the first place.

Is there a way to disable "smartquotes" in an HTML5 input field?

Upvotes: 4

Views: 1678

Answers (1)

Da Mahdi03
Da Mahdi03

Reputation: 1608

If you know what the character is turning into, just replace it with a regular quote before you submit the form.

str
            .replace(/[\u2014]/g, "--")        // emdash
            .replace(/[\u2022]/g, "*")         // bullet
            .replace(/[\u2018\u2019]/g, "'")   // smart single quotes
            .replace(/[\u201C\u201D]/g, '"');  // smart double quotes

This is just an example, i know it's tedious but that's one way to do it. Check out: https://asna.com/us/tech/kb/doc/remove-smart-quote for a script that has a lot of other special characters that are replaced to serve your same function

Upvotes: 5

Related Questions