FRIHOST • FORUMS • SEARCH • FAQ • TOS • BLOGS • COMPETITIONS
You are invited to Log in or Register a free Frihost Account!


When clicked goes into input field??

   Frihost Forum Index -> Scripting -> Html, CSS and Javascript
 




ncwdavid
Hey,
What I want is a little javascript or whatever language this can be done in:

You know when you are even posting on this forums and you want to put a smiley in your can just click whichever one and the code just pops into the text box you are writing in. How can I do that?

Thanks alot.
varun_dodla
This simple html code with a javascript function will help you. Just save it as a .html file and open in the browser for a demo.
Code:


<html>
<head>
<title></title>
<script>
function fnInsertSmiley(sSmileyText)
{
   document.forms[0].txt.value += sSmileyText;
                document.forms[0].txt.focus();
}
</script>
</head>
<BODY>
   <TABLE style="cursor: hand;font-weight: bold" border="1">
      <TR>
         <TD onClick="fnInsertSmiley(':-)');">
            [<font color="PINK">:-)</font>]
         </TD>
         <TD onClick="fnInsertSmiley(':-(');">
            [:-(]
         </TD>
         <TD onClick="fnInsertSmiley(';(');">
            [<font color="GREEN">;)</font>]
         </TD>
      </TR>
   </TABLE>
   <form>
      <TEXTAREA name="txt"></TEXTAREA>
   </form>
</BODY>
</html>



The Javascript function adds the string passed to it to the value of the input field (textarea in this case). You can also use links in place of the table cells.
ncwdavid
Thanks alot I am going to test it out now. I really needed it to continue my script!
ncwdavid
On this page that the code is going on I have 2 forms so what do I do? The items that are being clicked are images and they come after the input field i want the image location to go in. Any ideas? Can I name the form? If so what extra do I do to the JavaScript code?
varun_dodla
ncwdavid wrote:
On this page that the code is going on I have 2 forms so what do I do? The items that are being clicked are images and they come after the input field i want the image location to go in. Any ideas? Can I name the form? If so what extra do I do to the JavaScript code?


Let me answer each of your questions:
- Can we name a form if there are two?
- The answer is yes. There is not much extra javascript code needed to access that. You can acces then as following:
Code:
document.forms[0]

where 0 can be replaced by the form number you want to access OR another better way would be this:
Code:
document.formname

where formname will be the value you specify for the name attibute of the form tag.

- You want the image source to go in the inputfield?
- You can use the following in the image tag for this purpose:
Code:
onClick="fnInsertSmiley(this.src);"


Hope this helps.
ncwdavid
Thanks it works prefectly now but there is one other thing I would like to know. Before they click on one of the images there is already some text in the input field. How do I make that input box get cleared and at the same time the new image location goes in there when the image is clicked?

Thanks.
ncwdavid
Actually no its ok. Everthing is working!! Thanks for your help.
Related topics
File upload with PHP, Build an upload database for your site
Calculating FormattedCurrency
Inserting data to MYSQL with a PHP script
[JS] onclick to print out info
The Super Bowl XL		Textfield labels [resolved]
All About WoW
make a backoffice
Uplaoding images using php form :::: Help needed
Need Help Yet again :: Comment system, data from 3 tables !!		Non Violent war
Quantum Physics
Extremely Low Costing phpBB2 and 3 Services [UPDATED]
align text within input field with text outside
Reply to topic    Frihost Forum Index -> Scripting -> Html, CSS and Javascript

FRIHOST HOME | FAQ | TOS | ABOUT US | CONTACT US | SITE MAP
© 2005-2011 Frihost, forums powered by phpBB.