Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Regular Coder
    Join Date
    Apr 2006
    Posts
    133
    Thanks
    6
    Thanked 0 Times in 0 Posts

    Form button + img tag

    Hi all,

    I have a text area in a form. I am planning to put a button of "Add Image" on the top. When someone clicks on it I want a window to be opened where people can enter the file name. When they enter the file I want the code write [img=thefilenametypedinwindow] where the cursor is.

    For example.
    If my text in the text area is "This is a test sentence." and the cursor is between the words "a" and "test", and then they click on "Add Image", I want the window opens and when the client type test.jpg and click OK. Then my text in the text area needs to be :

    This is a [img=test.jpg] test message

    Any idea ??

    Thanks

  • #2
    Regular Coder
    Join Date
    Apr 2006
    Posts
    133
    Thanks
    6
    Thanked 0 Times in 0 Posts
    Noone??

  • #3
    Senior Coder
    Join Date
    Nov 2006
    Posts
    1,000
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I searched and found this post.

    http://www.webmasterworld.com/forum91/4686.htm

    which allowed me to create.

    Code:
    <html>
      <head>
        <title>Insert [img] at Cursor</title>
        <script type="text/javascript">
          function doIt(s) {
            var adiv = document.getElementById("adiv");
            adiv.innerHTML = s;
          }
          function addimage(id) {
            var textEl = document.getElementById(id);
            var name=prompt("Please enter image name","")
            if (name!=null && name!="") {
              insertAtCursor(textEl, "[img=" + name + "]");
            }
          }
          function insertAtCursor(myField, myValue) { 
            //IE support 
            if (document.selection) { 
              myField.focus(); 
    
              //in effect we are creating a text range with zero 
              //length at the cursor location and replacing it 
              //with myValue 
              sel = document.selection.createRange(); 
              sel.text = myValue; 
            } 
            //Mozilla/Firefox/Netscape 7+ support 
            else if (myField.selectionStart || myField.selectionStart == '0') { 
              //Here we get the start and end points of the 
              //selection. Then we create substrings up to the 
              //start of the selection and from the end point 
              //of the selection to the end of the field value. 
              //Then we concatenate the first substring, myValue, 
              //and the second substring to get the new value. 
              var startPos = myField.selectionStart; 
              var endPos = myField.selectionEnd; 
              myField.value = myField.value.substring(0, startPos)+ myValue+ myField.value.substring(endPos, myField.value.length); 
            } else { 
              myField.value += myValue; 
            } 
          } 
        </script>
      </head>
      <body>
        <div>
          <form name="f" action="#">
            <textarea name="aboutus" id="aboutus" rows="6" cols="50">Isn't that just wonderful.</textarea>
            <input type="button" value="Add Image" onClick="addimage('aboutus');" />
          </form>
        </div>
      </body>
    </html>
    FYI, often people look to see if any threads are unanswered. I almost didn't read your post since you bumped it and I figured someone answered it already.

    david_kw


  •  

    Posting Permissions

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