Intersoft Community - WebInput - How can I change the background of a WebInput control from Javascript

How can I change the background of a WebInput control from Javascript

yudi — Thu, 18 Feb 2010 23:07:26 GMT

Below is the snippet code that will apply style in inner frame of WebInput.

<script type="text/javascript">
    <!--
    function Button100_onclick() {
        var WebInput1 = ISGetObject("WebInput1");
        WebInput1.GetFrameElement().childNodes[0].childNodes[0].childNodes[0].childNodes[0].childNodes[0].style.backgroundColor = "Red";

        return true;
    }
    -->
</script>

This inner frame element is the parent of parent element of the control element that I mention on my previous post. I enclosed the screenshot of the WebInput that has been set its background color to red. It has no padding or margin or white border around the red color.

WebInput has its own dynamic style (active, normal, and over) applied by using css class. If you find that your own style is not seems to be applied, please try to use “!important” behind the style declaration (as seen on the sample below).

wiCity.GetFrameElement().childNodes[0].childNodes[0].childNodes[0].childNodes[0].childNodes[0].style.backgroundColor = "Red" !important;

Since WebInput has its own dynamic style, I suggest you to apply the style directly (not using css class). I don’t try to say that it is not possible to apply css class over WebInput control, but it’s kind of fussing since you’ll need to override the default css class or redefine your style on active, normal, and over.

Hope this helps.

How can I change the background of a WebInput control from Javascript

mitch.constantine@gmail.com — Thu, 18 Feb 2010 18:38:50 GMT

This is not quite what I wanted.

If I apply the first method I get the look in the attached file ( image1.gif). I don't want to have white borders around my control.

If I use the second method, I simply get nothing (the control looks just like without our style).

Neither of the two methods seems to be working, and I don't understand what is wrong.

Could you please suggest a method that works or attach a working sample? Thank you!

How can I change the background of a WebInput control from Javascript

yudi — Tue, 09 Feb 2010 23:27:01 GMT

Below is the snippet javascript code that shows how to change background color or applying a css class of WebInput.

function Button1_onclick() {
    var wiAddress = ISGetObject("wiAddress");

    wiAddress.GetControlElement().style.backgroundColor = [define your color in here];
    wiAddress.GetControlElement().className = [define your css class name in here];

    return true;
}

Hope this helps.

How can I change the background of a WebInput control from Javascript

mitch.constantine@gmail.com — Tue, 09 Feb 2010 18:33:56 GMT

I would need to mark some WebInput controls on my page by changing their background color (ideally by applying a CSS class). All other controls on the page should remain unaffected.

How can I do this from Javascript?