Insert smiley in asp.net

Insert smiley images automatically in asp.net when user enter emotion text

Now let me show how you can easily do the same in asp.net with simple javascript code.

• First of all download some smiley images and paste them in your website's root folder
• Put a div element inside your aspx page with contentEditable property set to true and onkeyup="replacewithimg(this);"

• In head section of your aspx page add the following javascript

Explaination:

• txt & img are two Arrays which holds the emotion text and emotion image element source code respectively side by side

• replacewithimg is a function which accept div as a parameter in which the client is typing. This function is called when user press and release a key. In this function I created a for loop which checks whether any emotion text is there in div or not, if it is there then the javascript's replace() function will replace it with corresponding img tag which is stored in img array and after replacing the text set div's innerHTML to var innHTML which contains the updated innerHTML.
  

[Note: regular.gif, tongue.gif and Sad.gif are the names of my smiley images, Please update them if you have different names]

Download Demo Website