Forum Discussion

NancyHyde-35f43's avatar
NancyHyde-35f43
Community Member
22 days ago

Remove red squiggles for spellcheck on text entry.

I'm using the following code to add a scrollbar to a lengthy text entry box, and I want to add code so that red squiggles for spellcheck don't appear.  How do I do that? const TextAreaScrollbar = (...
NancyHyde-35f43's avatar
NancyHyde-35f43
Community Member
19 days ago

Thanks for your response, but that code didn't work for me. I still get red squiggles for misspelled words in the text entry box.  Does it matter that the misspelled words are pre-populated in the text entry box using the text entry variable?

Kingman's avatar
Kingman
Community Member
16 days ago

Hi Nancy, 

Ah strange, it worked for me in preview mode. 

Preview mode when I test with the above code:

Preview mode without the JavaScript code:

This is how I applied it:

The script is definitely executing?

  • NancyHyde-35f43's avatar
    NancyHyde-35f43
    Community Member
    13 days ago

    It doesn't work when you pre-populate the text box, at least with multiple lines of text like I am doing.  Here is an illustrative storyline file.

    • Kingman's avatar
      Kingman
      Community Member
      2 days ago

      Hi Nancy,

      Sorry for the delayed response.

      I see... I did test this on single line only. I didn't test on multiple lines.

      If you haven't figured it out, try and replace the code with the following. It should cover both single and multiple line cases.

      (function () {
    function disable() {
        document.querySelectorAll(
            'input[data-dv_ref="input"], textarea.acc-textinput, textarea.acc-shadow-el'
        ).forEach(el => {
            el.spellcheck = false;
            el.autocomplete = "off";
            el.autocorrect = "off";
            el.autocapitalize = "off";
        });
    }

    // Run immediately
    disable();

    // Re-run whenever Storyline injects or updates slide content
    new MutationObserver(disable).observe(document.body, {
        childList: true,
        subtree: true
    });
})();