D4mations.com

Real Time Text Input Filter tutorial Program Textarea Javascript HTML Tutorial



Lesson Code: http://www.developphp.com/video/JavaScript/Real-Time-Text-Input-or-Textarea-Filter-Tutorial
In this Javascript programming lesson you can learn Real-Time Filtering of Text Input. You can learn how to program real time strict text fields that will strip or replace unwanted characters from the field as the user types. Using the search or replace String object methods in Javascript along with the RegExp object gives us a wide of logic possibilities in our Javascript pattern matching with regular expressions.

Original source

d4mer

, , , , , , , , , , , , , , , , , , , ,

40 responses to “Real Time Text Input Filter tutorial Program Textarea Javascript HTML Tutorial”

  2. hey man thanks for the video , I was having a problem updating a textarea in real time. I see you used value and I tried it and it worked. I was using textContent , I don't know why textContent don't update in real time but in OPERA browser value updates in real time on a mouse event. I'm making a text replacement program. example fb = facebook

  4. Hey Adam, It worked perfectly. Very nice tutorial the only thing that's missing, is prevent users input in copy paste too.. I've tried the same with onpaste() event handler but without success. Regarding any help thanks

  5. Thanks Adam, i write a resume:

    <script type="text/javascript">
                function filtrarTextoInput(textfield) {
                    var regex = /[^a-z0-9]/gi;

                    if (textfield.value.search(regex) > -1) {

                        textfield.value = textfield.value.replace(regex, "");
                    }
                }
            </script>
            <textarea id="myID" name="myID" onkeyup="filtrarTextoInput(this)" onkeydown="filtrarTextoInput(this)" > </textarea>

  7. Great tutorial! I got a question though. If you are replacing single characters, like for example you press "x" and "z" appears, "x" will still show up for an instance before it's replaced. How to avoid that? I'm on a project simulating a non-ASCII input method using javascript.. Thanks.

  8. a bit late to this tutorial but if I'm allowed a little add, I want to say that if we want to allow some specila characters (like dash or underscore), we have to use backslashes into the argument (- or _), just like the new line (n). I hope Adam won't mind about this comment, some guys (like me) might be wondering about it.

  20. Hi….I have a quick question on one of your older tutorials, from your website and here. I tried to write you a message, and not able to send it. I have to be a 'buddy.' With that said, I found your most recent, and hope you don't mind me asking here. I wanted to know, from learning your flash cms….how to incorporate the flash site with it….or any site with it. You teach how to make the flash cms, and then a site. But how you put them together. Thanks! 🙂

  29. Thanks for tuning into the videos. Adobe Dreamweaver is the editor I am using in this video. But since we do not enter "design mode" at all in the video and are doing nothing but straight code… any editor will do… even notepad++ or simple notepad. Dreamweaver has nice formatting, code completion and syntax highlighting huh? That is why I use it.

  31. Hey a positive comment… thanks but my brains are mud. I have to write everything down so I don't forget it. My other subscribers are pissing me off so thanks for saying something kind and encouraging.

  36. Dear Mr. Adam "Sugar" Khoury Sir, Thank you for showing the path of Illumination, and I seriously miss all your hate literature and abuses on Facebook, Please come back!! 😀
    You ARE AWESOME!!!

  40. Great tutorial. Your videos are really starting to unlock the power of programming to me (even though I still think in a designer's mindset – not a programmers). But I am slowly starting to wish I would hand code every single one of my projects! Thumbs up.

Leave a Reply