Form a Story Project - How to add "-ing" validation?

For the “Form a Story” project, how do you add a pattern to an input that will only allow text ending in “ing”?

For example, the “Verb” for this form should end in “ing”, how can I add validation where only text ending in “ing” can be submitted?

You would have to do that using Javascript. Check whether the last 3 characters match "ing’. If it does, allow the word, if it is not, return an error.

1 Like

Ah, I see! I guess I’ll see how that works when I get to Javascript. Thanks for the reply :slight_smile:

1 Like

Unfortunately, this kind of task cannot be accomplished using plain HTML and CSS. As janneslohmeijer said you’ll need some Javascript here.

You need to take the string from the input box and check whether the last 3 letters match the string ‘ing’.


<input id="myString" type="text">

<script> 
        // Here the input value is stored in a new variable x  
  
        function stringCheck() {

            let x =  document.getElementById("myString").value; 
            
            let suffix_x = x.substring(x.length-3);

                if (suffix_x !== 'ing') {
                   alert(`The word must end with ${'ing'}.`);
                   return false;
                }
        } 
    </script>

Something like this should hopefully do the job.

1 Like