<form name="form"><textarea name="message"></textarea>
<img src="" onmousedown="(do the prompt box)">
</form>

i need help how to figure out how to prompt the user with a javascript prompt() to enter a url(link) that includes an http://

after the user enters the url in the prompt box and clicks OK, i want the textarea to add the following to were the mouse cursor/carat was at:

<a href="(the link that the user submitted)">(the link that the user submited)</a>

the only code i found that does anything relavent is this one:

<img onmousedown="addTags('[link]','[/link]')" src="ajax/addlink.png" border="0">

and this JS function adds the tags(bbcode thing)

function addTags(Tag,fTag,Message)
{
  var obj = document.form.message;

  obj.focus();

  if (document.selection && document.selection.createRange)  // Internet Explorer
  {
sel = document.selection.createRange();
if (sel.parentElement() == obj)  sel.text = Tag + sel.text + fTag;
  }

  else if (typeof(obj) != "undefined")  // Firefox
  {
var longueur = parseInt(obj.value.length);
var selStart = obj.selectionStart;
var selEnd = obj.selectionEnd;

obj.value = obj.value.substring(0,selStart) + Tag + obj.value.substring(selStart,selEnd) + fTag + obj.value.substring(selEnd,longueur);
  }

  else obj.value += Tag + fTag;

  obj.focus();
}

where the cursor is, and if text is highlighted it keeps that text and ads the bbcodes around it. but this is not what i want. i want the textarea to have the html link with the users imputted url two times like i stated above.
i have very little expirince with javascript and like none with prompt();
i dont even know how to get the usersinput.

Recommended Answers

All 9 Replies

Member Avatar for rajarajan2017

This is the script for prompt

<head>
<script type="text/javascript">
<!--
function prompter() {
var reply = prompt("Hey there, good looking stranger!  What's your name?", "")
alert ( "Nice to see you around these parts " + reply + "!")
}
//-->
</script>
</head>
<body>
<input type="button" onclick="prompter()" value="Say my name!">
</body>

yeah ive seen that code, but i dont understand how to put the users input in the textarea after they click ok(along with the <a href=" parts
wait, so would it be something like,

function prompter(){
var reply = prompt("enter url", "http://")
insert the reply into the textarea thing how?
and dont insert it if they click cancel.

i know that big code on my first post has something i can use. but im lost on how

prompt var userinput
validate [do nothing if null; error/reprompt if invalid]

var oTD = document.getElementById('targetdiv')
var eNA = oTD.appendChild(document.createElement("a"));
eNA.setAttribute("href", userinput);
eNA.appendChild(document.createTextNode(userinput));

Step4 could insert text of your choosing instead of repeating the uri.

i dont understnad, is target div, the textarea id?
step 4, i dont understand eithr, the userinput, its got to be in two places,

<a href="here">andhere</a>

so the "href", userinput wont work

Do you want create a clickable link?
Or do you just want to see the text displayed in the textarea where it can be edited?

As for Step4: I gave you the code for putting the same value in both places; I was merely pointing out that there is another choice.

If you don't want a clickable link then assign id="target" to the textarea and use this

var oTA = document.getElementById('target')
    oTA.appendChild(document.createTextNode('<a href="'+userinput+'">'+userinput+'</a>'));

If you do want it to be clickable, assign id="target" to a div (for example) and use the first code.

thanks, it works,but.... heres my code:

function prompter(){
var userinput = prompt("enter url", "http://")
var oTA = document.getElementById('tt')
oTA.appendChild(document.createTextNode('<a href="'+userinput+'">'+userinput+'</a>'));
}

but bbecause.. well it will only work if the textarea is empty! one time.
i want it to do it multiple times and insert i where the cursor is. now that big hunk of code i first posted on my original post does something with inserting it where the cursor is,

i want it to insert where the cursor is
multiple times

This

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <meta name="generator" content=
    "HTML Tidy for Windows (vers 25 March 2009), see www.w3.org">
    <script type="text/javascript">

    userinput = "http://whatever"

    function insertLink(sID, sUI) {

        var oTA = document.getElementById(sID);

        if (document.selection) {     //IE 
            oTA.focus();
            var rStartEnd = document.selection.createRange();
            rStartEnd.text = sUI;
        } else if (oTA.selectionStart||oTA.selectionStart == '0') {
            var rStart = oTA.selectionStart;
            var rEnd = oTA.selectionEnd;
            oTA.value = oTA.value.substring(0, rStart) + sUI + oTA.value.substring(rEnd);
        } else {  // insert [append] at end
            oTA.value += sUI;
        }
    }

    </script>
    <title></title>
  </head>
  <body>
	<textarea id="fxm"></textarea> 
	<button onclick="insertLink('fxm',userinput)">Insert Link</button>
  </body>
</html>

will handle that part of the problem. You were previously given the steps to prompt for userinput. Validation (if any) and formatting is up to you.

Note: as written, if text is selected [highlighted] it will be replaced by userinput; otherwise, userinput is inserted at the [possibly implied] insertion point [caret/I-beam].

i adapted it, let me know if u find errors, i checked it in firefox, it works perfectly, im going to check it in ie and google chrome...

<textarea id="details" onmousedown="prompter();">
function prompter(){
var userinput = prompt("enter url. it should contain http://", "http://")
var oTA = document.getElementById('details')
var insertthis = '<a href="'+userinput+'">'+userinput+'</a>';
if (document.selection) {     //IE 
            oTA.focus();
            var rStartEnd = document.selection.createRange();
            rStartEnd.text = insertthis;
        } else if (oTA.selectionStart||oTA.selectionStart == '0') {
            var rStart = oTA.selectionStart;
            var rEnd = oTA.selectionEnd;
            oTA.value = oTA.value.substring(0, rStart) + insertthis + oTA.value.substring(rEnd);
        } else {  // insert [append] at end
            oTA.value += insertthis;
        }
}
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.