8 Replies Latest reply on Jan 23, 2009 11:17 AM by rtalton

    Validating skinned components

    Craig Grummitt Level 3
      i have discovered that when i do the following:
      1. i create a form with a comboBox and textInput in formItems.
      2. i add a borderSkin to the textInput component and a ComboBox_skin to a comboBox(for example)
      3. i use a Validator to validate this field and it is found to be invalid

      the red border does not appear around the component(that would have otherwise, if the component did not have a skin)

      how do i have both the red border, and skinned components?
        • 1. Re: Validating skinned components
          VarioPegged Level 2
          See if forcing the focus to be redrawn on the text input fixes your problem. In your EmailValidator, add

          invalid="ti.drawFocus(true)" //ti is TextInput control id

          • 2. Re: Validating skinned components
            Craig Grummitt Level 3
            interesting solution idea. thanks, but no cigar unfortunately. forcing focus on invalid fields does display the focus box, but the invalid border still does not appear.

            which may have been an acceptable fudge if there was only ever one invalid field, but there is often more than one, and there can only ever be one focus box.
            • 3. Re: Validating skinned components
              VarioPegged Level 2
              With regard to the border, could it be that the very mechanism you're expecting to provide error validation feedback is being replaced by your custom border skin on the text input?

              The Flex TextInput control is far from ideal. I'm a stickler for usability and I've had to modify it extensively for my own purposes. However, I've never had to change the border behavior. Have you looked through the source?

              If you can't resolve this, couldn't you provide some other feedback to the user, like changing the invalid inputs' text color to red and bolding it? I would even recommend multiple sticky error tooltips on invalid fields, not just one that's only visible on rollover of a single field.

              • 4. Re: Validating skinned components
                Craig Grummitt Level 3
                Have you ever skinned the TextInput? have you found that Validation indicator borders no longer appear too? Have you added sticky error tooltips on all invalid fields regardless of rollover? if so, could you describe how?

                looked through which source? the TextInput source? As I find going through the underlying component code quite complicated and laborious, I usually use this as a last resort if possible. Also - this is made doubly difficult by the word 'validate' having an ambiguous meaning! So tho i have briefly looked at TextInput, I haven't found a solution immediately forthcoming, so thought i'd see if this was possible with the already existing component before i look at modifying the component.
                • 5. Validating skinned components
                  Craig Grummitt Level 3
                  just to make this error easier to replicate if anyone out there wants to look into this further, i have a simple MXML application with a form containing a field that is validated to be an email adress and a textInput style.(see below)

                  i also created a textInput border skin from Flash template(and didn't even change the template) - you can get this here.

                  now compile the app with the style and without the style and you will see that the textinput does not display the constant red border when it is deemed invalid by the EmailValidator, when it is skinned.
                  • 6. Re: Validating skinned components
                    We are having the same issue. Did you find a way to fix this?
                    • 7. Re: Validating skinned components
                      Same issue here too. Really need solution for this. It is the border skin which messes up the validation outline.
                      • 8. Re: Validating skinned components
                        rtalton Level 4
                        If someone could supply a (current) skin and some code, I'll give it a shot.