I am having a problem with a javascript script.

Add this code to an html file if you wanna try it.

<html>
<head>
<script>
var n = 0;
function addtb(){
	document.getElementById('TextEditor').focus();
	cmd = 'InsertInputText';
	document.getElementById('TextEditor').document.execCommand(cmd,'true');
	document.getElementById('TextEditor').blur();
	

	var TE = document.getElementById('TextEditor');
	var TEcn=TE.children;

	for (i=0;i<TEcn.length;i++) 
	{
		n++;
		if(TEcn[i].id == "")
			TEcn[i].id = "tb" + n;

	}
}
function tellids(){
	var TE = document.getElementById('TextEditor');
	var TEcn=TE.children;

	for (i=0;i<TEcn.length;i++) 
	{
		alert(TEcn[i].id);

	}
}
</script>
</head>
<body bgcolor=dddddd>
<div  id="TextEditor" contenteditable="true" indicateeditable="true" 
style="BACKGROUND-COLOR:white;OVERFLOW: auto;WIDTH: 600px;HEIGHT: 500px;WORD-WRAP: break-word"></div>
<input type=button onclick="addtb();" value="add a text box">
<input type=button onclick="tellids();" value="alerts of textbox ids">
<br>

After you add your first textbox to the editor, you need to unselect it to be able to add another textbox with only one click of the button.
If you dont, you will have to doubleclick the button, and I dont want that.
I would like the selected textbox to be blurred and then add another textbox with a single click of the button.

</body>
</html>

After you add your first textbox to the editor, you need to unselect it to be able to add another textbox with only one click of the button.
If you dont, you will have to doubleclick the button, and I dont want that.
I would like the selected textbox to be blurred and then add another textbox with a single click of the button.

If anyone could help, I would really appreciate it.

thx

You need to empty the current selection range.

function addtb()
{
  document.selection.empty();
  document.getElementById("TextEditor").focus();
  cmd = 'InsertInputText';
  document.getElementById('TextEditor').document.execCommand(cmd,'true');

  var TE = document.getElementById('TextEditor');
  var TEcn=TE.children;

  for (i=0;i<TEcn.length;i++)
  {
    n++;
    if(TEcn[i].id == "")
    TEcn[i].id = "tb" + n;
  }

}
commented: Thanks, I seached long for this but for some reason, I did not find it. :) +1

Thanks. So simple and it works.

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.