[RESOLVED] Adding into a text input

Muncey

How would i go about making something so when its clicked it gets added into the text field?

For example if i have a bunch of letters i could click them and they would appear in the text field. Therefore you could type out words and things without using a keyboard.

Id like it real time so im not sure if id need to have it made using AJAX.

So yeah thats it really, you just add words into a input text field by clicking things. If i have to make the clickable things images thats fine. I just need to make it so i can put things into a text field on a form.

Thanks in advance.

Piranha

I don't know exactly how you should do it, but I know that you should use JavaScript for it.

Muncey

Cool thanks, ill look into that.

Muncey

Im having no luck, could someone help me please?

leatherback

You need javascript.

Please post what you have done so far, and what is not working.

you will need:
onclick();
form.field.value
or something like div.id.innerHTML

(that is all on top of my head. not behind my dev. machine)

Possibly this field can help:
http://www.webdeveloper.com/forum/archive/index.php/t-36782.html

Muncey

This is what i have so far.

<html>
<head>
    <script language="javascript">
	function inserttext(text,area){
		if(document.getElementById(name)){
			document.name.focus();
			document.name.value = document.name.value + " " + text;
			document.name.focus();
                }

}
</script>
</head>

<body>
Name: <input type="text" name="Name" /><br />
<br /><br />
Smilies: <img src="images/smile.bmp" onClick="inserttext(': )', 'Name');" />
<br /><br />
<input type="submit" value="Submit" />
</body>
<html>

leatherback

Hi Munchey,

Just had a trawl through my old sites. Here are some javascripts which I wrote/edited for inserting codes and stuff into forms using javascript. Hope they are of help. This stuff really takes a bit of searching and trial-n-error.. My JS is definately not up-to-scratch to just create it in a few sec.

Especially the writetag should be of help


<script language="javascript">
<!--

function bbcode(v, element)
 {
 if (document.selection) // für IE
   {
    var str = document.selection.createRange().text;
    document.forms['entryform'].elements[element].focus();
    var sel = document.selection.createRange();
    sel.text = "[" + v + "]" + str + "[/" + v + "]";
    return;
   }
  else if ((typeof document.forms['entryform'].elements[element].selectionStart) != 'undefined') // für Mozilla
   {
    var txtarea = document.forms['entryform'].elements[element];
    var selLength = txtarea.textLength;
    var selStart = txtarea.selectionStart;
    var selEnd = txtarea.selectionEnd;
    var oldScrollTop = txtarea.scrollTop;
    var s1 = (txtarea.value).substring(0,selStart);
    var s2 = (txtarea.value).substring(selStart, selEnd)
    var s3 = (txtarea.value).substring(selEnd, selLength);
    txtarea.value = s1 + '[' + v + ']' + s2 + '[/' + v + ']' + s3;
    txtarea.selectionStart = s1.length;
    txtarea.selectionEnd = s1.length + 5 + s2.length + v.length * 2;
    txtarea.scrollTop = oldScrollTop;
    return;
   }
  else input('[' + v + '][/' + v + '] ');
  updatepreview();
 }




function insert_link(element)
 {
 if (document.selection) // für IE
   {
    var str = document.selection.createRange().text;
    document.forms['entryform'].elements[element].focus();
    var sel = document.selection.createRange();
    sel.text = "[link=" + str + "]Link[/link]";
    return;
   }
  else if ((typeof document.forms['entryform'].elements[element].selectionStart) != 'undefined') // für Mozilla
   {
    var txtarea = document.forms['entryform'].elements[element];
    var selLength = txtarea.textLength;
    var selStart = txtarea.selectionStart;
    var selEnd = txtarea.selectionEnd;
    var oldScrollTop = txtarea.scrollTop;
    var s1 = (txtarea.value).substring(0,selStart);
    var s2 = (txtarea.value).substring(selStart, selEnd)
    var s3 = (txtarea.value).substring(selEnd, selLength);
    txtarea.value = s1 + '[link=' + s2 + ']Link[/link]' + s3;
    txtarea.selectionStart = s1.length;
    txtarea.selectionEnd = s1.length + 18 + s2.length;
    txtarea.scrollTop = oldScrollTop;
    return;
   }
  else input('[link=]Link[/link] ');
  updatepreview();
 } 


function writeImgTag(code, element)
{
var cache = document.forms['entryform'].elements[element].value;
this.code = code;
document.forms['entryform'].elements[element].value = cache + " <img src='<? echo $baseurl ?>gif/smilies/" + code + ".gif'> ";
document.forms['entryform'].elements[element].focus();
updatepreview();
}




function detectKey(e, element)
  {
  var code;
  if(!e) var e=window.event;
  if(e.keyCode){code=e.keyCode;}
  else if(e.which){code=e.which;}
  else{code = 0;}
  if(code==13)
    {

document.entryform.elements[element].value = document.entryform.elements[element].value + "<br>" ;

}

  }


function replaceSubstring(text,expression,value){
<?
//var exp = new RegExp(expression,'g')
?>
return text.replace(expression,value)
}

Muncey

Ok ill try when i get back, thanks a lot.