Exclude Emojis from input

Sarah_Esteve · 2025-03-03T21:00:46.064Z

HEllo all !
I need my users not be allowed to use emojis in inputs.
So I used bubbletojavascript when the input value is changed to detect emojis and display a warning message + disable the submit button.
But if they add an emoji then click directly on the submit button, seems that the javascript is too slow and the disabled condition doesn’t work.
I also tried to add a Terminate this WF with the condition (Javascript to Bubble is yes) but same.
Also tried to put the Run javascript in a custom event to process it in order but same.
If someone has an idea !!! Thank you !!

rafaelchavantes · 2025-03-04T03:07:24.024Z

Hey Sara! I had a similar issue before, and I got it working. Here’s what I did using toolbox plugin. Make sure your JavaScript to Bubble event triggers properly and updates your workflow:

1. Add the “JavaScript to Bubble” element

Drag the “JavaScript to Bubble” element onto your page.
In the element settings:
- Set a Function Name (e.g., removedText).
- Remeber to check the “Trigger event” box and Plublish value
- Set the type to Text.

2. Modify your JavaScript in the “Run JavaScript” action

Use this script in your “Run JavaScript” action:

function removeEmojis(text) {
    return text.replace(/[\p{Emoji}\u200d]+/gu, '');
}

// Make sure the function exists before calling it
if (typeof bubble_fn_removedText === "function") {
    bubble_fn_removedText(removeEmojis(properties.param1));
} else {
    console.error("Bubble function not found.");
}

param1 should be the input value you’re checking for emojis.

3. Create a workflow after the submit button

To run the script

4. Use the JavaScript to Bubble Result

There are two ways to use the cleaned text:

Trigger a workflow:
- Create a “When JavaScript to Bubble - removedText’s value is changed” event.
- Make sure no unnecessary conditions are blocking it.

Sarah_Esteve · 2025-03-10T15:44:38.173Z

hello @rafaelchavantes and thanks for your help.

I already try to integrate this method, but what I would like is not clean the text, but alert people they added an emoji and it’s not allowed.

What I did is adding a “detectEmoji” script rather than an “removeText” , added a custom event with return data when the submit button is clicked :

image772×492 32.9 KB

image1672×1434 186 KB

I ended up to make it work with custom event