Textcolor, Backgroundcolor - but i need TextBackgroundcolor ?

Discussion in 'HTML' started by LeftHorn, Apr 1, 2006.

  1. LeftHorn

    LeftHorn Guest

    Hi,

    I have a problem...Got a webpage with alot of different input fields - where
    a user can maintain a database.

    They are allowed to use 'spaces' in their textfields, sometimes they require
    to insert a space in the end, sometimes it would be fatal if they do - the
    problem is that from a visual point of view the inputfield is like this:

    TextColor Black
    BackGround White

    Nobody are able to see how many spaces there is after a string, unless the
    cursor is placed in the field - i need somehow to get a different
    TextBackgroundColor (ex. gray) then they would be able to locate it by
    sight, instead of having to manually run through all fields.

    Can this be done ? by HTML or JS or something ? hope you can help.
     
    LeftHorn, Apr 1, 2006
    #1
    1. Advertising

  2. LeftHorn wrote:
    > Hi,
    >
    > I have a problem...Got a webpage with alot of different input fields - where
    > a user can maintain a database.
    >
    > They are allowed to use 'spaces' in their textfields, sometimes they require
    > to insert a space in the end, sometimes it would be fatal if they do - the
    > problem is that from a visual point of view the inputfield is like this:
    >
    > TextColor Black
    > BackGround White
    >
    > Nobody are able to see how many spaces there is after a string, unless the
    > cursor is placed in the field - i need somehow to get a different
    > TextBackgroundColor (ex. gray) then they would be able to locate it by
    > sight, instead of having to manually run through all fields.
    >
    > Can this be done ? by HTML or JS or something ? hope you can help.

    What you can do is add for the <input> gray as background e.g.
    <input name="Name" size="32" style="background: gray;">
    --
    Edwin van der Vaart
    http://www.semi-conductor.nl/ Links to Semiconductors sites
    http://www.evandervaart.nl/ Persoonlijke website
    Explicitly no permission given to Forum4Designers, onlinemarketingtoday,
    24help.info and issociate.de to duplicate this post.
     
    Edwin van der Vaart, Apr 1, 2006
    #2
    1. Advertising

  3. LeftHorn

    Noozer Guest

    "Edwin van der Vaart" <> wrote in message
    news:3IuXf.8491$zc1.648@amstwist00...
    > LeftHorn wrote:
    >> Hi,
    >>
    >> I have a problem...Got a webpage with alot of different input fields -
    >> where a user can maintain a database.
    >>
    >> They are allowed to use 'spaces' in their textfields, sometimes they
    >> require to insert a space in the end, sometimes it would be fatal if they
    >> do - the problem is that from a visual point of view the inputfield is
    >> like this:
    >>
    >> TextColor Black
    >> BackGround White
    >>
    >> Nobody are able to see how many spaces there is after a string, unless
    >> the cursor is placed in the field - i need somehow to get a different
    >> TextBackgroundColor (ex. gray) then they would be able to locate it by
    >> sight, instead of having to manually run through all fields.


    It's a bad interface if it depends on spaces at the end of items, but this
    may not be under your control.

    Off the top of my head what I would do is create three small javascript
    functions...

    #1 - Called when the data is put into the form. Converts all spaces in all
    fields to a normally unused character (like "¬" - if that even goes through
    the newsgroups).

    #2 - Called when the form is submitted. Converts all these special
    characters back to spaces.

    #3 - Called by the OnKeyPress event of each field. It would make sure that
    any spaces typed by the user are changed to your special character.

    http://www.devguru.com/technologies/ecmascript/quickref/evhan_onKeyPress.html
     
    Noozer, Apr 1, 2006
    #3
  4. LeftHorn

    BootNic Guest

    > "LeftHorn" <> wrote:
    > news:442e6f6c$0$154$....
    >
    > Hi,
    >
    > I have a problem...Got a webpage with alot of different input
    > fields - where a user can maintain a database.
    >
    > They are allowed to use 'spaces' in their textfields, sometimes
    > they require to insert a space in the end, sometimes it would be
    > fatal if they do - the problem is that from a visual point of view
    > the inputfield is like this:
    >
    > TextColor Black
    > BackGround White
    >
    > Nobody are able to see how many spaces there is after a string,
    > unless the cursor is placed in the field - i need somehow to get a
    > different TextBackgroundColor (ex. gray) then they would be able to
    > locate it by sight, instead of having to manually run through all
    > fields.
    >
    > Can this be done ? by HTML or JS or something ? hope you can help.


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <script type="text/javascript">
    String.prototype.trim=function(){return this.replace(/^\s+|\s+$/g,'');}
    String.prototype.plus=function(){return this.trim()+' ';}
    </script>
    <title></title>
    </head>
    <body>
    <!--
    Form values should be checked on the server.
    JavaScript should only be used to assist the user.
    -->
    <form action="javascript:void(this)">
    <!--
    Remove white space before and after value
    -->
    <input onchange="this.value=this.value.trim()"><br>
    <!--
    Remove white space before and after value then add one space to the end
    -->
    <input onchange="this.value=this.value.plus()">
    </form>
    </body>
    </html>


    --
    BootNic Saturday, April 01, 2006 9:51 AM

    It is well known that "problem avoidance" is an important part of
    problem solving. Instead of solving the problem you go upstream and
    alter the system so that the problem does not occur in the first
    place.
    *Edward de Bono*
     
    BootNic, Apr 1, 2006
    #4
  5. LeftHorn wrote:
    > Hi,
    >
    > I have a problem...Got a webpage with alot of different input fields - where
    > a user can maintain a database.
    >
    > They are allowed to use 'spaces' in their textfields, sometimes they require
    > to insert a space in the end, sometimes it would be fatal if they do - the
    > problem is that from a visual point of view the inputfield is like this:
    >
    > TextColor Black
    > BackGround White
    >
    > Nobody are able to see how many spaces there is after a string, unless the
    > cursor is placed in the field - i need somehow to get a different
    > TextBackgroundColor (ex. gray) then they would be able to locate it by
    > sight, instead of having to manually run through all fields.
    >
    > Can this be done ? by HTML or JS or something ? hope you can help.
    >
    >


    No, that is the job for data validation...you are validating all tainted
    user input BEFORE it is utilizes on the server, right?

    You can use JavaScript as an optional prescreening validation, but the
    bottom line server-side validation must be done on all user input.

    --
    Take care,

    Jonathan
    -------------------
    LITTLE WORKS STUDIO
    http://www.LittleWorksStudio.com
     
    Jonathan N. Little, Apr 1, 2006
    #5
  6. LeftHorn

    LeftHorn Guest

    Hi all, thanks for your input here...

    We can for sure agree that one way to solve it was datavalidation when the
    data is going to be processed - but this cant be done since different fields
    can be used for different purposes, and a SPACE character is a character
    that can make sense, even as a trailing space.

    Therefore i want to be able to assist the user, so they can spot theese
    additional spaces - some of which are totally alright, i cant unfortunately
    make a general rule that strips leading and trailing spaces, etc. etc.

    So the only way i can see you would be able to help the user, was that you
    had the backgroundcolor ex. white the textbackground ex. grey, the textcolor
    ex. black - that way it would pop into the eyes. But i guess that cant be
    easily done unless im going to convert it into somekind of applet or
    application ?
     
    LeftHorn, Apr 1, 2006
    #6
  7. While the city slept, LeftHorn () feverishly
    typed...

    > Hi,
    >
    > I have a problem...Got a webpage with alot of different input fields
    > - where a user can maintain a database.
    >
    > They are allowed to use 'spaces' in their textfields, sometimes they
    > require to insert a space in the end, sometimes it would be fatal if
    > they do

    [spaces at end of fields]

    There are a couple of options. One as mentioned is to test the data when it
    is received. If you know what fields are *not* allowed to have spaces at the
    end you can strip them. Also, you can scan the fields (server side),
    checking the last character in each one where there may be a problem. If the
    last character is a space, you can warn the user and ask them to edit the
    field. And another also, use something like PHP to display the contents of
    the field (outside of a text box) wrapped in something like square brackets.
    This is something I have done in the past in C programming so I can the full
    content of a string, including leading or trailing spaces. Something like
    <p>[<?=$field1?>]</p>.

    Hope that helps.

    Cheers,
    Nige

    --
    Nigel Moss http://www.nigenet.org.uk
    Mail address will bounce. | Take the DOG. out!
    "Your mother ate my dog!", "Not all of him!"
     
    nice.guy.nige, Apr 1, 2006
    #7
  8. LeftHorn wrote:
    > Hi,
    >
    > I have a problem...Got a webpage with alot of different input fields - where
    > a user can maintain a database.
    >
    > Nobody are able to see how many spaces there is after a string, unless the
    > cursor is placed in the field - i need somehow to get a different
    > TextBackgroundColor (ex. gray) then they would be able to locate it by
    > sight, instead of having to manually run through all fields.
    >
    > Can this be done ? by HTML or JS or something ? hope you can help.


    Nope, JS can't do that - you don't have enough control over the form elements to apply
    style to them letter by letter.

    Two alternatives:
    1) A rather contrived one, not recommended: substitute each <input> with an iframe.
    Requires quite a bit of javascript to make it look and work like an input box, works
    slower and so on. I would never use it in a situation like yours. If you must, google for
    javascript rich textarea.
    2) Instead of coloring the spaces at the end of the input box, warn the user about those
    spaces in another way (not by coloring those exact spaces). You could for example make a
    red asterisk appear beside the textbox in question. Or you could color the whole textbox
    yellow - if you let the users know wwhat that means, it can be just as effective. Still
    requires JS, of course, but is much cleaner. Google for javascript events and onkeypress.
     
    Mitja Trampus, Apr 1, 2006
    #8
  9. LeftHorn

    BootNic Guest

    > "LeftHorn" <> wrote:
    > news:442eaabb$0$186$....
    >
    > Hi all, thanks for your input here...
    >
    > We can for sure agree that one way to solve it was datavalidation
    > when the data is going to be processed - but this cant be done
    > since different fields can be used for different purposes, and a
    > SPACE character is a character that can make sense, even as a
    > trailing space.
    >
    > Therefore i want to be able to assist the user, so they can spot
    > theese additional spaces - some of which are totally alright, i
    > cant unfortunately make a general rule that strips leading and
    > trailing spaces, etc. etc.
    >
    > So the only way i can see you would be able to help the user, was
    > that you had the backgroundcolor ex. white the textbackground ex.
    > grey, the textcolor ex. black - that way it would pop into the
    > eyes. But i guess that cant be easily done unless im going to
    > convert it into somekind of applet or application ?


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head><meta http-equiv="content-type" content="text/html; charset=utf-8">
    <script type="text/javascript">
    function tellerror(msg, url, lnn){
    alert('Error message= '+msg+'\nURL= '+url+'\nLine Number= '+lnn)
    return true
    }
    window.onerror=tellerror
    </script>
    <script type="text/javascript">
    var b,v,w,g;
    function dink(){
    b=w.nextSibling;
    if(v!=w.value){
    v=w.value;
    while(b.tagName.toLowerCase()!='label'){b=b.nextSibling;}
    if(!b.childNodes[0]){b.appendChild(document.createTextNode(w.value));}
    else{b.childNodes[0].data=w.value;}
    }
    }
    function blink(s){
    w=s;
    g=window.setInterval('dink(w)',250);
    }
    </script>
    <style type="text/css">
    ..d{
    color:red;
    background-color:pink;
    margin: 0.3em;
    padding: 0.2em;
    }
    </style>
    <title></title>
    </head>
    <body>
    <form action="javascript:void(this)">
    <input onfocus=
    "blink(this)" onblur=
    "window.clearInterval(g)"><label class="d"></label><br>
    <input onfocus=
    "blink(this)" onblur=
    "window.clearInterval(g)"><label class="d"></label><br>
    <input onfocus=
    "blink(this)" onblur=
    "window.clearInterval(g)"><label class="d"></label><br>
    </form>
    </body>
    </html>

    --
    BootNic Saturday, April 01, 2006 1:31 PM

    A well-developed sense of humor is the pole that adds balance to your
    step as you walk the tightrope of life
    *William Arthur Ward*
     
    BootNic, Apr 1, 2006
    #9
  10. LeftHorn wrote:
    > Hi all, thanks for your input here...
    >
    > We can for sure agree that one way to solve it was datavalidation when the
    > data is going to be processed - but this cant be done since different fields
    > can be used for different purposes, and a SPACE character is a character
    > that can make sense, even as a trailing space.


    Whoa! When you do data verification you should not apply one rule
    universally! E.g., if the field is say 'price' then the validation
    should be numeric only [0-9] '.' and '-' maybe. 'name' alpha, street
    alpha and numeric for street numbers....

    >
    > Therefore i want to be able to assist the user, so they can spot theese
    > additional spaces - some of which are totally alright, i cant unfortunately
    > make a general rule that strips leading and trailing spaces, etc. etc.


    but your said previously:
    >> They are allowed to use 'spaces' in their textfields, sometimes they
    >> require to insert a space in the end, sometimes it would be fatal if
    >> they do - the problem is that from a visual point of view the
    >> inputfield is like this:


    "fatal"? If so you better to data validation! Or I see one very very
    hackable site.

    >
    > So the only way i can see you would be able to help the user, was that you
    > had the backgroundcolor ex. white the textbackground ex. grey, the textcolor
    > ex. black - that way it would pop into the eyes. But i guess that cant be
    > easily done unless im going to convert it into somekind of applet or
    > application ?


    You cannot change the color of portions of form input values. Of course
    not to sound like a broken where here a URL can certainly help
    especially when the questions are ambiguous.


    --
    Take care,

    Jonathan
    -------------------
    LITTLE WORKS STUDIO
    http://www.LittleWorksStudio.com
     
    Jonathan N. Little, Apr 1, 2006
    #10
  11. LeftHorn

    BootNic Guest

    > "BootNic" <> wrote:
    > news:fJzXf.463$....
    >

    [snip]
    > .d{
    > color:red;
    > background-color:pink;
    > margin: 0.3em;
    > padding: 0.2em;

    white-space:pre;
    > }

    [snip]

    --
    BootNic Saturday, April 01, 2006 1:38 PM

    The only thing that saves us from the bureaucracy is inefficiency. An
    efficient bureaucracy is the greatest threat to liberty.
    *Eugene McCarthy *
     
    BootNic, Apr 1, 2006
    #11
  12. LeftHorn wrote:

    > Hi,
    >
    > I have a problem...Got a webpage with alot of different input fields -
    > where a user can maintain a database.
    >
    > They are allowed to use 'spaces' in their textfields, sometimes they
    > require to insert a space in the end, sometimes it would be fatal if they
    > do - the problem is that from a visual point of view the inputfield is
    > like this:


    Can you give an example of where/why a trailing space would be required,
    when it would be fatal in another case?


    --
    Blinky RLU 297263
    Killing all posts from Google Groups
    The Usenet Improvement Project: http://blinkynet.net/comp/uip5.html
    Coming Soon: Filtering rules specific to various real news clients
     
    Blinky the Shark, Apr 1, 2006
    #12
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Cliff Cotterill

    DropDownList BackgroundColor not set

    Cliff Cotterill, Nov 15, 2007, in forum: ASP .Net
    Replies:
    10
    Views:
    767
    Juan T. Llibre
    Nov 16, 2007
  2. André
    Replies:
    4
    Views:
    460
    André
    Jun 19, 2008
  3. Philip

    default style.backgroundColor value

    Philip, Sep 19, 2003, in forum: Javascript
    Replies:
    1
    Views:
    114
  4. RobG

    backgroundColor and Firefox

    RobG, Nov 3, 2004, in forum: Javascript
    Replies:
    1
    Views:
    113
    Thomas 'PointedEars' Lahn
    Dec 12, 2004
  5. cosmic foo

    backgroundColor

    cosmic foo, Jul 24, 2005, in forum: Javascript
    Replies:
    13
    Views:
    214
    Richard Cornford
    Jul 25, 2005
Loading...

Share This Page