?
Solved

change background-color of textarea

Posted on 2007-03-18
9
Medium Priority
?
3,863 Views
Last Modified: 2013-11-20
Hi,

I am trying to change the background-color of a "textarea" element in an html page.
This is the code:

void CHtmProps::changeBgColor(int color)
{
 MSHTML::IHTMLDocument2Ptr spDoc=GetHtmlDocument();
 MSHTML::IHTMLElementPtr spBodyElement=spDoc->Getbody();
 MSHTML::IHTMLElementCollectionPtr pElc= spBodyElement->Getall();
 MSHTML::IHTMLElementPtr spElement=0;
 _bstr_t id, bg;
  int len = pElc->length;
  for(int i = 0; i < len; i++)
  {
  _variant_t va((long) i, VT_I4);
  spElement = pElc->item(va);
  //id=spElement->Getid();
  _bstr_t bstrTagName = spElement->GettagName();
  if (!stricmp(STRING bstrTagName,"textarea")) // "IsuHtmlEditor"))
 {
  _variant_t color((long) color, VT_I4);
  BSTR bstrAttName =SysAllocString(L"background-color");              
  VARIANT_BOOL Suc = FALSE;
  spElement->setAttribute(bstrAttName,color,Suc);
  SysFreeString(bstrAttName);
  }
 }
}

it does not work.
0
Comment
Question by:VapiSoft
  • 5
  • 3
9 Comments
 
LVL 30

Expert Comment

by:Mark Steggles
ID: 18744451
Hello,

You can easily control the background-color of a textarea with css...

textarea {background-color:#369;}

Regards
Steggs
0
 

Author Comment

by:VapiSoft
ID: 18744488
Hi Steggs,

I know I can do that in the textarea tag, but I beed to do it dynamically.
Either from a java-script function, or from a CHtmView method.
The code that I wrote is inside CHtmProps which is derived from ChtmlView
0
 
LVL 4

Expert Comment

by:cx323
ID: 18744857
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script>
function changecolor(hex){
document.getElementById('color_change').style.backgroundColor=hex;
}
</script>
</head>
<body>
<a href="#" onclick="changecolor('#fff666')">yellow</a>
<a href="#" onclick="changecolor('#000fff')">blue</a>
<textarea id="color_change" style="width:300px;height:200px"></textarea>
</body>
</html>
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:VapiSoft
ID: 18744968
Hi cx323:

Your code works as stand alone, but it does not work in my HTML because I have "editor.js" attach to it.
When I remove the "editor.js" it works. Do you know how I can solve this problem (I am not familer with java-script programming).
More info:
I am using "htmlArea" to edit HTML.
I am trying to change the button "background-color" to change the entire background (rather than the text-background).
0
 
LVL 4

Expert Comment

by:cx323
ID: 18744990
could you post a link to your site online so i can look at the issue their since i've never used htmlArea.  and by background do you mean the body background color or what?
0
 

Author Comment

by:VapiSoft
ID: 18745076
Hi,

I am not uning it in my site (www.vapisoft.com) but in my application.
I downloaded it from http://www.codeproject.com/jscript/htmlarea.asp

It is amaizing peace of software, but it caused me a lot of problems.
One problem is this, and the other (which I am breaking my head on) is that under ChtmlView id does not process the Enter key.

0
 
LVL 4

Accepted Solution

by:
cx323 earned 2000 total points
ID: 18745313
i just had a quick glance through the source and it looks like this will work:

look for this part of the editor.js file:
// fgColor and bgColor
  else if (cmdID == 'ForeColor' || cmdID == 'BackColor') {
    var oldcolor = _dec_to_rgb(editdoc.queryCommandValue(cmdID));

paste in this code:
// fgColor and bgColor
  else if (cmdID == 'ForeColor' || cmdID == 'BackColor') {
    var oldcolor = _dec_to_rgb(editdoc.queryCommandValue(cmdID));
    var newcolor = showModalDialog(_editor_url + "popups/select_color.html", oldcolor, "resizable: no; help: no; status: no; scroll: no;");
      if(cmdID == 'BackColor' && newcolor != null){editdoc.body.style.backgroundColor = newcolor;return;}
    if (newcolor != null) { editdoc.execCommand(cmdID, false, "#"+newcolor); }
  }

only this line is new:
if(cmdID == 'BackColor' && newcolor != null){editdoc.body.style.backgroundColor = newcolor;return;}
0
 

Author Comment

by:VapiSoft
ID: 18746409
Hi cx323,

I want to thank you very much.
Because i don't know JS I tried to do it for my application and spent a lot of time (tto much time) to it.
Thanks.
0
 

Author Comment

by:VapiSoft
ID: 18746461
One more thing if I may.
How do i initialize it that it will be open in a certain color (not white).
I set the HTML page from my application like that
<textarea name="IsuHtmlEditor"  style="width:800; height:150;background-color: #6699ff">
but when I open it with the editor.js it is white.
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses how to create an extensible mechanism for linked drop downs.
Originally, this post was published on Monitis Blog, you can check it here . In business circles, we sometimes hear that today is the “age of the customer.” And so it is. Thanks to the enormous advances over the past few years in consumer techno…
In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…
Suggested Courses

850 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question