[RichWidgets] Input_SetPrompt on password field

[RichWidgets] Input_SetPrompt on password field

  

Hello.

We use a Input_SetPromt on the input fields for the login. Only we also want to use it on the password field, but this would not work.

The input prompt is not displayed as text, but as a password (so the input prompt look like: *********).

We have worked around this to set a image as background with the input prompt text, only this will never be exact the same as the input prompt for the username field.

Do anyone know a better solution for this?

Kind Regards,
Evert
Hi Evert,

It's a dirty workaround but you should be able to fix this with an "onfocus" javascript that
hides the selected inputfield and then shows a hidden password field on click.

I hope you have some java scripting skills around. :)
PS; don't forget you're working Agile here.
Yes, having a consistent interface is important; but spending a lot of time on one inconsistent field doesn't add up to the true advantages you gain from it.
Try to use the RichWidgets\Help_Contextual if you can't seem to get this working the way you would like to.

I agree with you that the password field 'example' should be displayed consistent to the input example.
Giving feedback to outsystems support concerning cases like this has lead to quick and good results in my case so I'd advise you to do so too.

Watch out with using those examples by the way for if you use realistic values as an example, currently
(at least in version 5.0.2.x of the Platform server) inputting the example results in inputting NULL values.
The values currently get blanked after you type them and tab out or submit the form.
I'm hoping this is fixed in a newer Richwidgets version. (I reported this 'bug' today)


Hi Eric,

Thanx for you're reply but certainly for you're solution. It looks like a good one, now hope it also will be ;).

I almost send all my feedback trough the support, mostly because there is much private developing. This time is wasn't and I also needed a quick reply.. More people know more then less ;).

I let you know what the outcome will be (shall be later on because know we have other priorities (agile? :) )).

Kind Regards,
Evert
Crossing my fingers for you. :)

Please post the Javascript here; it might be useful for the community (or Outsystems R&D team)
Hello,

In our solution we only need to add the "Title" on the extend property, the following Javascript code does the rest:

$(document).ready(function(){
        $('input[type=text][title],input[type=password][title],textarea[title]').each(function(i){
              $(this).addClass('input-prompt-' + i);
              var promptSpan = $('<span class="input-prompt"/>');
              $(promptSpan).attr('id', 'input-prompt-' + i);
              $(promptSpan).append($(this).attr('title'));
              $(promptSpan).click(function(){
                  $(this).hide();
              $('.' + $(this).attr('id')).focus();
              });
              if($(this).val() != ''){
                 $(promptSpan).hide();
              }
             $(this).before(promptSpan);
             $(this).focus(function(){
                $('#input-prompt-' + i).hide();
             });
             $(this).blur(function(){
                 if($(this).val() == ''){
                    $('#input-prompt-' + i).show();
                 }
             });
});

Don't forgot about the css class, we create a new one( 'input-prompt' ).

Regards