/    Sign up×
Community /Pin to ProfileBookmark

pass argument of 2 colors to textarea

[code]<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″ />
<title>Editor</title>
<style type=”text/css”>
<!–
.editorbuttons {
list-style: none;
margin: 0px;
padding: 0px;
}
.editorbuttons li {
float: left;
}
.editorbuttons li img {
border:none;
}
.editorbody{clear:both; float:none;}
–>
</style>
<script type=”text/javascript”>
//First initiate some variables

var isEditable= false;
var isIE;
var isGecko;
var isSafari;
var isKonqueror;
var browser = navigator.userAgent.toLowerCase();

function initiateEditor() {
//check what browser is in use

isIE = ((browser.indexOf(“msie”) != -1) && (browser.indexOf(“opera”) == -1) && (browser.indexOf(“webtv”) == -1));
isGecko = (browser.indexOf(“gecko”) != -1);
isSafari = (browser.indexOf(“safari”) != -1);
isKonqueror = (browser.indexOf(“konqueror”) != -1);

//enable designMode if the browser is not safari or konqueror.
if (document.getElementById && document.designMode && !isSafari && !isKonqueror) {
isEditable= true;
}
}

//Javascript function dislpayEditor will create the textarea.

function displayEditor(editor, html, width, height) {
dis= “call him”
html=”this is me” +”nn” +dis
if(isEditable){
document.writeln(‘<iframe id=”‘ + editor + ‘” name=”‘ + editor + ‘” width=”‘ + width + ‘px” height=”‘ + height + ‘px” readonly></iframe>’);
//create a hidden field that will hold everything that is typed in the textarea
document.writeln(‘<input type=”hidden” id=”hidden’ + editor + ‘” name=”hidden’ + editor + ‘” value=”” readonly>’);
//assign html (textarea value) to hiddeneditor
document.getElementById(‘hidden’ + editor).value = html;
//call function designer
designer(editor, html);
}else{
document.writeln(‘<textarea name=”‘ + editor + ‘” id=”‘ + editor + ‘” cols=”39″ rows=”10″ >’ + html + ‘</textarea>’);
}
}

/*function displayColor() {
//———————validating Name values————————-+

var fName=self.opener.document.forms[0].yourname.value;
strName=fName.toUpperCase();
if(strName.length==0) {
opener.alert(“Please enter your Name”);
}
if(isNaN(strName)) {
“”;
}
else {
opener.alert(“Please you can not enter figure for Name”);
strName=””;
}

mercy +=”<TR><TD ALIGN=RIGHT><B>NAME <B></TD>” +”<TD><I>” +strName +”</I></TD></TR>”;
mercy +=”</TABLE></CENTER><BR></BR>”;
//self.document.write(mercy +”<BR>”);

}*/

//this is designer function that enables designMode and writes default text to the text area
function designer(editor, html) {
var mainContent= “<html id=” + editor + “><head></head><body><CENTER><TABLE CELLPADDING=0, CELLSPACING=0><CAPTION><ALIGN=TOP><TR><TD ALIGN=RIGHT><B><I><FONT COLOR=BLUE SIZE=4>” + html + “</I></B></FONT></TD></TR></TABLE></CENTER><BR></BR></body></html>” ;

//assign the frame(textarea) to the edit variable using that frames id
var edit = document.getElementById(editor).contentWindow.document;
//write the content to the textarea
edit.write(mainContent);
edit.close();
//enable the designMode
edit.designMode = “On” ;
document.getElementById(editor).contentDocument.designMode = “on”;
}

//To execute command we will use javascript function editorCommand.
function editorCommand(editor, command, option) {
// first we assign the content of the textarea to the variable mainField
var mainField;
mainField = document.getElementById(editor).contentWindow;
// then we will use execCommand to execute the option on the textarea making sure the textarea stays in focus
try {
mainField.focus();
mainField.document.execCommand(command, false, option);
mainField.focus();
} catch (e) { }
}

function updateEditor(editor) {
if (!isEditable) return;
//assign the value of the textarea to the hidden field.
var hiddenField = document.getElementById(‘hidden’ + editor);
if (hiddenField.value == null) hiddenField.value = “”;
hiddenField.value = document.getElementById(editor).contentWindow.document.body.innerHTML;
}

</script>
</head>

<body>
<p><strong><a href=”http://www.emirplicanic.com/javascript/cross-browser-textarea-editor.php”>Go back to tutorial.</a></strong></p>
<form action=”#” name=”edit” method=”POST” id=”edit” onsubmit=”return submitForm();”>

<script language= “JavaScript” type= “text/javascript” >
<!–
function submitForm() {
updateEditor(‘content’);
return true;
}

initiateEditor();
//–>
</script>
<script language= “JavaScript” type= “text/javascript” >
//this calles displayEditor function. Parametars are (textarea name, textarea width, textarea height)
displayEditor(‘content’, ‘Default Text’, 600, 300);
//–>
</script>
</div>

</form>

</body>
</html>
[/code]

/*+++++++++++++++++++++++++javascript++++++++++++++++++++++++++++++++++*/

hi, i always appreciate your effort in hepling me.
1. please i want to pass in arguments that have two colors into the textatea. How do i achieve this?

  • 2.

    How do i make image appear in the textarea?

  • 3.

    I try to use “n” in the code it does not work, what could be the problem?

  • to post a comment
    JavaScript

    1 Comments(s)

    Copy linkTweet thisAlerts:
    @FangJun 21.2010 — 
  • 1. Only 1 color can be used on teatarea content, all the content then has tis color.


  • 2. Not possible. textarea can not have html. You can give the textarea a background image.


  • 3. IE uses "rn" other browsers "n"


  • All visual content that you see in a RTE is in the iframe. The (hidden) textarea only holds the textual representation of the document in the iframe.
    ×

    Success!

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

    Tweet This
    Sign in
    Forgot password?
    Sign in with TwitchSign in with GithubCreate Account
    about: ({
    version: 0.1.9 BETA 6.17,
    whats_new: community page,
    up_next: more Davinci•003 tasks,
    coming_soon: events calendar,
    social: @webDeveloperHQ
    });

    legal: ({
    terms: of use,
    privacy: policy
    });
    changelog: (
    version: 0.1.9,
    notes: added community page

    version: 0.1.8,
    notes: added Davinci•003

    version: 0.1.7,
    notes: upvote answers to bounties

    version: 0.1.6,
    notes: article editor refresh
    )...
    recent_tips: (
    tipper: @nearjob,
    tipped: article
    amount: 1000 SATS,

    tipper: @meenaratha,
    tipped: article
    amount: 1000 SATS,

    tipper: @meenaratha,
    tipped: article
    amount: 1000 SATS,
    )...