1. #1
    Sencha Premium Member
    Join Date
    Nov 2011
    Posts
    162
    Vote Rating
    2
    Answers
    7
    UbuntuPenguin is on a distinguished road

      0  

    Default Answered: Hide and Show Textareafield border

    Answered: Hide and Show Textareafield border


    Hello Everyone,
    I have a Textareafield and I would like to show its border AND shadow while it is editable and hide it while it isn't. What is the best practices way of doing this. I have thought of using CSS, but I have absolutely no idea of how to use dynamic(?) css and there doesn't appear to be a border transparency option on the Textareafield class.

    Any help is greatly appreciated.

  2. After many hours and even more curse words, turns out I needed to use the 'readOnlyCls' property of the textareafield. My css looks like something like this.

    .instructions-read-only .x-form-item-body textarea
    {
    border-top-style : hidden !important;
    border-bottom-style : hidden !important;
    border-left-style: hidden !important;
    border-right-style: hidden !important;


    background-image: none !important;
    }

    Thanks for the help and leading me down the path of looking for the various state csss.

  3. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    9,197
    Vote Rating
    482
    Answers
    690
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    You could set the focusCls (and overCls) for when active and cls when not?

    Scott.

  4. #3
    Sencha Premium Member
    Join Date
    Nov 2011
    Posts
    162
    Vote Rating
    2
    Answers
    7
    UbuntuPenguin is on a distinguished road

      0  

    Default


    After many hours and even more curse words, turns out I needed to use the 'readOnlyCls' property of the textareafield. My css looks like something like this.

    .instructions-read-only .x-form-item-body textarea
    {
    border-top-style : hidden !important;
    border-bottom-style : hidden !important;
    border-left-style: hidden !important;
    border-right-style: hidden !important;


    background-image: none !important;
    }

    Thanks for the help and leading me down the path of looking for the various state csss.

Thread Participants: 1

Tags for this Thread