Member Avatar for DarkBerzerk™

Hey there, i am making cPanel to the websites i cr8..
so wanna it easy to the user to edit the texts..
gonna tell u what i have done.
the user have cPanel page...with text form, when he type the text and confirm some script automatic save this text into .txt file....other script in the home page import the text from that.txt file...

its working perfect the problem is if the user wanna add header or some thing..how i make the editor able to make the text head or paragraph or or or?

so what i want is adding some buttons in the text form...when i select word and press on button "HEADER" the codes <h1> </h1> automatic be added beside the selected word?!
and when i press "Break"
Automatic add <br /><hr width="50%" /><br /> ??? and so on??

Edited by DarkBerzerk™ because: n/a
  • 3 Contributors
  • 4 Replies
  • 122 Views
  • 13 Hours Discussion Span
  • Latest Post Latest Post by DarkBerzerk™
Member Avatar for vibhaJ

Hope this code will help..
u can modify it as per ur requirement.

<HTML>
<HEAD>Try</HEAD>
<BODY>
<form NAME="myForm">
<input TYPE="button" VALUE="Line Break" ONCLICK="insertString('</br>')">
<input TYPE="button" VALUE="H1 Tag" ONCLICK="insertString('<h1></h1>')">
<br>
<textarea NAME="myTextArea" ROWS="5" COLS="100"></textarea> 
</form>
</body>
</html>
<script LANGUAGE="Javascript">
var globalCursorPos=0; // global variabe to keep track of where the cursor was

function caret(node) {
 //node.focus(); 
 /* without node.focus() IE will returns -1 when focus is not on node */
 if(node.selectionStart) return node.selectionStart;
 else if(!document.selection) return 0;
 var c		= "\001";
 var sel	= document.selection.createRange();
 var dul	= sel.duplicate();
 var len	= 0;
 dul.moveToElementText(node);
 sel.text	= c;
 len		= (dul.text.indexOf(c));
 sel.moveStart('character',-1);
 sel.text	= "";
 return len;
}

function setCursorPos() { 
 globalCursorPos = caret(myForm.myTextArea); 
}

function insertString(stringToInsert) {
setCursorPos();
 var firstPart = myForm.myTextArea.value.substring(0, globalCursorPos);
 var secondPart = myForm.myTextArea.value.substring(globalCursorPos, myForm.myTextArea.value.length);
 myForm.myTextArea.value = firstPart + stringToInsert + secondPart;
}
</SCRIPT>
commented: Answered The Question! +0
Member Avatar for DarkBerzerk™

WOW AMAZING SEXY NICE :D...the last problem is in the headers and paragraphs..i will have to make button for start tag and other for end tag :D

Edited by DarkBerzerk™ because: n/a
Member Avatar for blocblue

Have you considered using a WYSIWYG editor such as TinyMCE? This has headers, paragraphs, hyperlinks, tables, images, etc.

R.

Member Avatar for DarkBerzerk™

Wow looks great...gonna try it...thanks much "robothy" will try it

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.