SitePoint Sponsor

User Tag List

Results 1 to 13 of 13
  1. #1
    011521 dbalsdon's Avatar
    Join Date
    Feb 2003
    Location
    North Of Scotland
    Posts
    444
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    inserting data into forms "automatically"

    HI...

    I'm trying to create a guestbook, and would like the visitor to be able to insert smilies into it..

    however, i'd like to have the smilies that can be used, displyed to the side of the comment box... so that, all the visitor has to do, is click on the smilie they want, and the coding for the smilie is automatically inserted into the form...

    Could somebody please tell me how to do this, or direct me to a site which will teach/show me how to do it???
    Daniel Balsdon
    My Site

  2. #2
    SitePoint Wizard bronze trophy
    Join Date
    Apr 2003
    Posts
    4,095
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try this:

    HTML Code:
    <!--...-->
    <script type="text/javascript">
    function InsertSmile
    {
    TargetBox = document.getElementById("TargetBox");
    TargetBox.Text = TargetBox.Text + ":)";
    //...
    }
    </script>
    <!--...-->
    <textarea id="TargetBox">
    <!--...-->
    </textarea>
    <!--...-->
    Replace all instances of ellipses with your own code.

  3. #3
    SitePoint Wizard
    Join Date
    Nov 2000
    Location
    Chico, Ca
    Posts
    1,125
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I can't remember where I got this but here is the code.

    This goes in the head:
    PHP Code:
    <script language="javascript">
                <!--
                function 
    writeImgTag(code)
                {
                var 
    cache document.form1.txtEntry.value;
                
    this.code code;
                
    document.form1.txtEntry.value cache " <img src=\"images/smilies/" code "\"> ";
                
    document.form1.txtEntry.focus();
                }
                
    //-->
            
    </script> 
    And this goes next to the form you want it to use. I left it in the <td> tags so you can get it in perspective:

    PHP Code:
    <tr>
                            <
    td>Entry</td>
                            <
    td><textarea name="txtEntry" cols="50" rows="12"></textarea></td>
                            <
    td style="width:40px"><% for (int i 0flist.lengthi++) 
                            { 
    out.print("<img src=images/smilies/"flist[i] +" onClick=\"writeImgTag('"flist[i] +"')\" />");}%></td
                            
                        </
    tr
    all you need to do is get some smilies and put them in the folder then the Javascript will do the rest.
    "Happiness doesn't find you, you find happiness" -- Unknown
    www.chuckknows.com

  4. #4
    SitePoint Wizard bronze trophy
    Join Date
    Apr 2003
    Posts
    4,095
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That's a lot better than my example, Chuck. But yours requires server-side code.

  5. #5
    011521 dbalsdon's Avatar
    Join Date
    Feb 2003
    Location
    North Of Scotland
    Posts
    444
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanx for both the responses...

    with the first code.. i have managed to sort it so that i dont get any errors when i run the function..however, the text that should be inserted into the textarea doesnt get "written".. any ideas??
    heres my code so far: -
    Code:
    <html>
    <head>
    <script>
    function InsertSmile()
    {
    TargetBox = document.getElementById("TargetBox");
    TargetBox.Text = TargetBox.Text + ":-)";
    }
    </script>
    </head>
    <body>
    <form name="form">
    <textarea id="TargetBox" rows="10" cols="35"></textarea>
    </form>
    <a href="#" onClick="InsertSmile()"><img src="test.jpg" width="16" height="16" id="smilie" /></a>
    </body>
    </html>
    its probably something straight forward...

    also, for the second code... i can see that the code is better, as it does more(if not all) of the work for you...and i dont mind having to use server-side code, however, i dont use PHP, so if it was to include server side code, then that would have to be in ASP... thanx ne way..
    Daniel Balsdon
    My Site

  6. #6
    SitePoint Wizard
    Join Date
    Nov 2000
    Location
    Chico, Ca
    Posts
    1,125
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by dbalsdon
    Thanx for both the responses...

    with the first code.. i have managed to sort it so that i dont get any errors when i run the function..however, the text that should be inserted into the textarea doesnt get "written".. any ideas??

    also, for the second code... i can see that the code is better, as it does more(if not all) of the work for you...and i dont mind having to use server-side code, however, i dont use PHP, so if it was to include server side code, then that would have to be in ASP... thanx ne way..
    It was actually JSP or java.. It shouldn't be that hard to transfer the code into vbscript..
    "Happiness doesn't find you, you find happiness" -- Unknown
    www.chuckknows.com

  7. #7
    SitePoint Evangelist Mr. Brownstone's Avatar
    Join Date
    May 2002
    Location
    Relative
    Posts
    452
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hereís another solution:
    HTML Code:
    <textarea id="MessageBody"></textarea>
    
    <img style="cursor: pointer; cursor: hand;"
    	onclick="document.getElementById('MessageBody').value+=' :)';"
    	src="/images/forum/smilies/smile.gif" alt="Smiley face." title=":)"
    />
    EDIT - I see you edited your post.

    The problem is on this line:
    Code:
    TargetBox.Text = TargetBox.Text + ":-)";
    It needs to be changed to:
    Code:
    TargetBox.value = TargetBox.value + ":-)";
    Or:
    Code:
    TargetBox.value += ":-)";
    Of course, that's just my opinion. I could be wrong.

  8. #8
    011521 dbalsdon's Avatar
    Join Date
    Feb 2003
    Location
    North Of Scotland
    Posts
    444
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ooppps... soz.. my mistake..
    Daniel Balsdon
    My Site

  9. #9
    011521 dbalsdon's Avatar
    Join Date
    Feb 2003
    Location
    North Of Scotland
    Posts
    444
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ok.. thanx Mr.Brownstone... your first reply worked fine(and will be the solution i'll use)...and your edit also worked.. thanx again..

    also, thanx Chuckie and Compuwhiz7 for your responses..
    Daniel Balsdon
    My Site

  10. #10
    SitePoint Wizard bronze trophy
    Join Date
    Apr 2003
    Posts
    4,095
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You're welcome. Sorry that some of our responses didn't work as well as we'd hoped.

  11. #11
    ********* Janitor levik's Avatar
    Join Date
    Jan 2003
    Location
    New York
    Posts
    885
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    These are all pretty basic... I know that I saw some people script it so that the inserted code gets placed at the cursor (as opposed to tagged on to the end)

    Any idea how this is done?

  12. #12
    011521 dbalsdon's Avatar
    Join Date
    Feb 2003
    Location
    North Of Scotland
    Posts
    444
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    it would be better if you could make the smilie display in the textbox when you click the button, or, if you want to format the text to make it bold ect... when u highlight it, then click the bold button, it displays in bold, inside the textarea...thats what i'm gonna try to do eventually...
    Daniel Balsdon
    My Site

  13. #13
    SitePoint Evangelist Mr. Brownstone's Avatar
    Join Date
    May 2002
    Location
    Relative
    Posts
    452
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You canít do this with a standard <textarea>. You need to use the rich-edit funtions of IE or Mozillaís Midas if you want to do advanced stuff like cursor and selection control, as well as styles. Actually, I think you can access the cursor and selection values in a <textarea> in IE, but if youíre going to start writing proprietary code, you might as well do it for Mozilla to remain at least reasonably cross compatible.
    Of course, that's just my opinion. I could be wrong.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •