Javascript Disabled Detected

You currently have javascript disabled. Several functions may not work. Please re-enable javascript to access full functionality.

0

emoticon into textfield

Started by Av-, Jul 11 2005 04:12 PM

You cannot reply to this topic
Go to first unread post

2 replies to this topic

#1 Av-

I Feel Left Out

Members
1,971 posts

Gender:Male
Location:10 ft. below sea level

Posted 11 July 2005 - 04:12 PM

ok, i recently made a simple news system with php. what i want is that the poster can add smilies to it. ive already done that with string replace so that

:)

will become

. not too hard to do. but what i now want is when somebody post a new news item there is a table with all the smilies above the textfield and when u click on 1 of the smilies it will add the text to the field. just like in this forum when u post a new reply.

Edited by Avalanche, 11 July 2005 - 04:12 PM.

Back to top

#2 softLearner

Young Padawan

Members
128 posts

Posted 12 July 2005 - 05:37 AM

Okay I've done this before on a guestbook I did.

What you need to do is have an onclick state on the image with this:
onClick="smilie(':grin:')"

so you should have something that looks like this:

<img src="images/biggrin.gif" alt="Big grin" width="15" height="15" onClick="smilie(':grin:')">

Where :grin: is in the brakets chnage that to how you want your smilie code to like in the textbox.

Now you'll need this simple function in java script:

function smilie(name) {
	document.gb_form.message.value += name;
	document.gb_form.message.focus();
}

Okay so in order for the above javascript to work you'll need a form to be named gb_form and a textarea named message

OR just change gb_form.message to this style: FORM_NAME.TEXTAREA_NAME

Staright forward FORM_NAME is the forms name and TEXTAREA_NAME is the textareas name.

So now you should have something like this for a test:
SAve it as smile.html and run it in your browser.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script type="text/javascript">
<!--
function smilie(name) {
	document.gb_form.message.value += name;
	document.gb_form.message.focus();
}
//-->
</script>
</head>
<body>

<form action="#" method="post" name="gb_form">
<img src="images/biggrin.gif" alt="Big grin" width="15" height="15" onClick="smilie(':grin:')">
<textarea name="message" cols="15" rows="10">
</textarea>
</form>

</body>
</html>

That is how I have done it. Also if your woundering how to BBCode too, the code for BBCode is little different to the smilie function.

Also the above function will work in FireFox and IE.

Edited by softLearner, 12 July 2005 - 05:40 AM.