ah yes i forgot.
you would get access denied when tried to change an input type property
the best way is to have two input types and just hide one and show the other
but i have a solution for you
the html
<!-- The following html of two input types - we gonna switch between
them-->
<input type="text" class="textinput" value="Passowrd" />
<input type="password" class="passinput" value="" />
the css
<style type="text/css">
/* first we need to hide the password input*/
.passinput {
display:none;
}
</style>
the js
<script type="text/javascript">
$(function() {
// declare your input types
var textinput = $(".textinput");
var passinput = $(".passinput");
// on text input focus - hide text input and show and focus
on password input
textinput.focus() {
textinput.blur();
textinput.hide();
passinput.show();
passinput.focus();
});
// on password input blud hide password input and show and
focus on text input
passinput.blur(function() {
passinput.blur();
passinput.hide();
textinput.show();
textinput.focus();
});
});
</script>
On Mon, Oct 19, 2009 at 2:51 PM, Marco Barbosa <marco.barbos...@gmail.com>wrote:
>
> Hi waseem!
>
> Thanks for your reply.
>
> Something's wrong with this line:
> $("#password").attr({type:'text'});
>
> I tried changing to:
> $("#password").attr('type','text'});
>
> but still no go.
> I have to comment out to get the other JS stuff on the site working.
>
> The rest of the code seems Ok. What could it be?
>
> I like your solution, pretty simple :)
>
> I was wondering if we could put this inside the cleanField function
> but I guess it's not necessary.
>
> ~Marco
>
>
> On Oct 19, 2:32 pm, waseem sabjee <waseemsab...@gmail.com> wrote:
> > // set the initial type to text
> > $(".mypasswordfield").attr({
> > type:'text'
> >
> > });
> >
> > // on user focus - change type to password
> > $(".mypasswordfield").focus(function() {
> > $(".mypasswordfield").attr({
> > type:'password'
> > });
> >
> > });
> >
> > // on user blur - change type to back to text
> > $(".mypasswordfield").blur(function() {
> > $(".mypasswordfield").attr({
> > type:'text'
> > });
> >
> > });
> >
> > since text is an attribute we can change it.
> > all im doing is changing the type between password and text on click and
> on
> > blur
> > let me know if this worked for you :)
> >
> > On Mon, Oct 19, 2009 at 11:21 AM, Marco Barbosa
> > <marco.barbos...@gmail.com>wrote:
> >
> >
> >
> >
> >
> > > Hi!
> >
> > > I'm trying to achieve something like the Facebook first page (when
> > > you're not logged in).
> >
> > > I'm using this simple function/plugin to clean the fields once you
> > > click them:
> > > $.fn.cleanField = function() {
> > > return this.focus(function() {
> > > if( this.value == this.defaultValue ) {
> > > this.value = "";
> > > }
> > > }).blur(function() {
> > > if( !this.value.length ) {
> > > this.value = this.defaultValue;
> > > }
> > > });
> > > };
> > > // clean the fields
> > > $("#login").cleanField();
> > > $("#password").cleanField();
> >
> > > So If I click Login or Password, it will clean and the user can type
> > > the new value.
> > > It works good but there's a little usability problem here.
> >
> > > I want to display the Password field like: "Your password here"
> > > instead of "***********"
> > > But when the user types his/her password, it has to go back to "****"
> >
> > > So Initially it should be: "Your login" "Your Password"
> > > And when the user clicks and starts typing it goes: "My login"
> > > "*******"
> >
> > > It's just the password field that masks the initial value by default.
> >
> > > If you check Facebook they managed to do that somehow.
> >
> > > Any ideas of how can I achieve this?
>
