Solved

change background-color of textarea

Posted on 2007-03-18
9
3,841 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 5
  • 3
9 Comments
 
LVL 30

Expert Comment

by:Steggs
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
Independent Software Vendors: 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 500 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

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!

Question has a verified solution.

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

Exception Handling is in the core of any application that is able to dignify its name. In this article, I'll guide you through the process of writing a DRY (Don't Repeat Yourself) Exception Handling mechanism, using Aspect Oriented Programming.
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

688 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