code for placing tags inside a textarea

@anothenNov 12.2010

In this forum the icons above will place tags (in “New Post” mode)
in this textarea and place the cursor in between.

I’ve made several attempts to duplicate this myself
I was just wondering if there is a simple script
for this.

Source code just does not tell me much.

This was my attempt:

[code=php]<?php // code_maker.php ?> <head> <script type=”text/javascript”> function getcode() { document.ftext.code_txt.value = document.ftext.code_txt.value + document.ftext.bold.value;

}

</script>

</head> <body onload=”document.ftext.code_txt.focus()”>

<form name=”ftext” method=”post” action=”<?php $_SERVER[PHP_SELF]; ?>”>

<table><tr> <td id=”left_side”> <textarea name=”code_txt” rows=”25″ cols=”75″ onchange=”getcode”> <?php echo $_POST[code_txt]; ?> </textarea> <input type=”submit” value=”enter”> </td>

<td id=”right_side”>

<input type=”text” name=”bold” value=”<b></b>” onclick=”getcode” disabled>

</td></tr></table>

</form> </body>[/code]

to post a comment

JavaScript

7 Comments(s) _↴

@anothenauthorNov 12.2010 — #sorry, I just made a major oops,

I forgot a whole bunch of code in order for

it to begin to work,

Please stand by on the replies.

@anothenauthorNov 12.2010 — #(I forgot a whole bunch of code. I was

trying to do it from memory)

Base code for which I'll work from:

[code=php]<head>
 <!-- javascript here -->
 <script type="text/javascript">
 function function_name(){
 f=document.form_name;
 f.amount.value = Number(f.first_number.value) 
 + Number(f.second_number.value);
 ;}
 </script>
 </head>
 <BODY onLoad="document.form_name.first_number.focus()" >
 <form NAME="form_name" method="post" 
 ACTION="<?php $_SERVER[PHP_SELF]; ?>">
 <TABLE> 
 <TR><TD>first_number</TD>
 <TD><input  NAME="first_number" value="1111" size="4" 
 onfocus="this.select()" OnBlur="function_name()"></TD></TR>
 
 <tr><td>second_number</td>
 <td><input type="text" name="second_number" value="2222"
 size="4" onChange="function_name()"></td></tr>
 
 <TR><TD>amount</td><td>
 <textarea rows="15" cols="75" NAME="amount" size="10" 
 OnFocus="function_name"></textarea>
 </TD></TR>
 
 </TABLE>
 </form></td><td>
 
 </body>
 [/code]

@anothenauthorNov 12.2010 — #Okay, I got this far and got brain locked.

I'll try again tomorrow, here's what I got

so far:

[code=php]<head>
 <!-- javascript here -->
 <script type="text/javascript">
 function function_name(){
 f=document.form_name;
 
 
 
 
 
 
 
 
 f.result.value = f.result.value + f.first_number.value;
 ;}
 </script>
 </head>
 <BODY onLoad="document.form_name.first_number.focus()" >
 <form NAME="form_name" method="post" 
 ACTION="<?php $_SERVER[PHP_SELF]; ?>">
 <TABLE> 
 <TR><TD>first_number</TD>
 <TD><input type="button"  NAME="first_number" 
 value="some_text" size="4" 
 onfocus="this.select()" onclick="function_name()"></TD></TR>
 
 <tr><td>second_number</td>
 <td><input type="button" name="second_number" value="2222"
 size="4" onChange="function_name()"></td></tr>
 
 <TR><TD>result</td><td>
 <textarea rows="15" cols="75" NAME="result" size="10" 
 OnFocus="function_name"></textarea>
 </TD></TR>
 
 </TABLE>
 </form></td><td>
 
 </body>
 [/code]

@anothenauthorNov 12.2010 — #Okay, this one works

however, I'm not sure how to

place the cursor between the tags.

[code=php]<head>
 <!-- javascript here -->
 <script type="text/javascript">
 function getcode()
 {f=document.codeform;
 
 switch(f.whichcode.value)
 {
 case "1":
 f.result.value = f.result.value + "<b></b>";
 f.whichcode.value = "";
 break;
 
  case "2":
  f.result.value = f.result.value + "<br>";
  f.whichcode.value = "";
  break;
 
  case "3":
  f.result.value = f.result.value + "<b></b>";
  f.whichcode.value = "";
  break;
 
  case "4":
  f.result.value = f.result.value + "<b></b>";
  f.whichcode.value = "";
  break;
 
 
 
  }
 
 
 ;}
 </script>
 </head>
 <BODY onLoad="document.codeform.result.focus()" >
 <a href="js_code.html">return</a><br>
 <form NAME="codeform" method="post" 
 ACTION="<?php $_SERVER[PHP_SELF]; ?>">
 <select  NAME="whichcode" 

 onchange="document.codeform.result.focus(); getcode()">
 <option value=""></option>
 <option value="1">bold</option>
 <option value="2">new line</option>
 </select>
 
 
 <textarea rows="15" cols="75" NAME="result" size="10" 
 OnFocus="getcode"></textarea>
 
 </form>
 
 </body>
 [/code]

@anothenauthorNov 15.2010 — #Well, this must be a boring thread.

But anyway, I did manage to get

some of the code written.

[code=php]<head>
 <title>js getcode</title>
 <!-- javascript here -->
 <script type="text/javascript">
 
 
 
 function getcode()
 {f=document.codeform;
 
 switch(f.whichcode.value)
 {
 case "1":
 f.result.value = f.result.value + 
 "<html><head>n</head><body>nnn</body></html>";
 f.whichcode.value = "";
 break;
 
  case "2":
  f.result.value = f.result.value + 
   "<table><tr><td>nnn</td></tr></table>";
  f.whichcode.value = "";
  break;
 
  case "3":
  f.result.value = f.result.value + "if(condition){}";
  f.whichcode.value = "";
  break;
 
  case "4":
  f.result.value = f.result.value + 
   "switch(n){case 1 code break; case 2 code break;}";
  f.whichcode.value = "";
  break;
 
  case "5":
  f.result.value = f.result.value + 
   "<?php $_SERVER[PHP_SELF]; ?>";
  f.whichcode.value = "";
  break;
 
  case "6":
  document.getElementById("theresult").select();
  f.whichcode.value = "";
  break;
 
 
 
  }
 
 
 ;}
 </script>
 </head>
 <BODY onLoad="document.codeform.result.focus()" >
 <a href="js_code.html">return</a><br>
 <form NAME="codeform" method="post" 
 ACTION="<?php $_SERVER[PHP_SELF]; ?>">
 
 
 <table><tr><td>
 <textarea id="theresult" rows="15" cols="75" 
 NAME="result"></textarea>
 </td></tr>
 <tr><td>
 <select  NAME="whichcode" 

 onchange="document.codeform.result.focus(); getcode()">
 <option value=""></option>
 <option value="1">html doc</option>
 <option value="2">table</option>
 <option value="3">if/then</option>
 <option value="4">switch</option>
 <option value="5">&#60;?php $_SERVER[PHP_SELF]; ?></option>
 <option value="6">select all</option>
 </select>
 </td></tr></table>
 </form>
 
 </body>
 [/code]

I can't seem to find a way to place the cursor

between the tags, but I just needed a simple

way of making a few shortcuts.

I know, I know; there are many free code

generating programs out there, however,

I've learned that the best way to learn code

is to first hard code it yourself.

I sure like the "getElementByID", I'm already

starting to find many uses for it.

@FangNov 15.2010 — #http://shawpnendu.blogspot.com/2009/03/javascript-how-to-setget-cursor.html

@anothenauthorNov 15.2010 — #http://shawpnendu.blogspot.com/2009/03/javascript-how-to-setget-cursor.html[/QUOTE]

Thanks Fang.

I'm still trying to get it to work.

I guess I need to see an example.

I got brain lock again.

Also in #JavaScript _↴

using arrays select an option using javascript Image Gallery

Success!

Help @anothen spread the word by sharing this article on Twitter...

Tweet This

code for placing tags inside a textarea

7 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

code for placing tags inside a textarea

7 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

7 Comments(s) _↴

Also in #JavaScript _↴