javascript prompt for password (i.e. *******) - javascript

I'm writing a bookmarklet and I need to be able to prompt the user for a "password". However, I don't want it to be in clear text on screen, so I cannot use prompt.
Is there a masked alternative to prompt()?
Any other suggestion?

You can create a floating div on the current page, with a form containing a password field.

alternative: let the bookmarlet point to a particular web page. Get the password from the user on that page, and continue.
This solution does not use javascript at all, as you may have noticed. If you really insist on using javascript, you will have to create a new window using javascript (window.open), add form and input elements to it, and set the form's submit value to your web app backend.
you can of course, display a dialog box on the current page, but that will be pretty irritating to the user. Be warned.
jrh

there isn't one - try looking into Thickbox on a modal setting like this:
Open iFrame Modal

The easy, fast answer: No, there are no cross browser method like window.prompt() that masks the user input. There are however some proprietary stuff you could look into. In MSIE you got window.createPopup(), window.showModalDialog() and window.showModelessDialog(). However I don´t reccomend using this approach =P
What would happen if you used http authentication for your destination? Would the UA prompt the user with a un/pw?

Related

prevent this page from creating additional dialogs

I am currently working on project and i have requirement to use java script input dialog to take input from user
see example
now i want to remove this check box which says that prevent this page from creating additional dailogs
how i can remove this message from alert box
You cant remove because it's introduced by browser.
To solve you problem try to employ http://bootboxjs.com/, whit this library you ca do the same by writing:
bootbox.prompt("Enter password please", function(result) {
// do something whit result
});
You can't remove this as it's a browser security feature. You should probably look at other ways of presenting your dialog - use a modal window instead for example.
So what you want to do it's IMPOSSIBLE. Since it's a browser functionality.
Anyway I advice you to use a Model-Box.
You will:
- Prevent that from happen
- Beautify your website.
You may want to check this: http://www.fallr.net/ I've used it's pretty cool and easy. Tou have the PROMPT-LIKE example wich returns you something written by the user. You can also have a CALLBACK to some AJAX function for example.
So you can't remove it make that clear for you at least for now.
Dont use alert system boxes they are ugly.. really..
Hope it helped!
i fount the answer
We have two different things going on here...
I'm suggesting adding a preference to about:config (or user.js in your
profile folder).
Copy the preference name dom.successive_dialog_time_limit Open
about:config Right-click in the preferences area and choose New >
Integer Paste the preference name and click OK Then enter 0 and click
OK
for more details chek this link
Prevent this page from creating addtional dialogs

JQuery / Javascript popup box and form submission creation

I have a jquery/javascript question. For a site I am working on in PHP/JQuery I have the need to create a dialogue box with an ok/cancel button and a message and then submit a form based on if the user says ok or not. I know in javascript I can create a new window that links to a styled page and then I can do a select for if the user hits the ok button and submit the windows parent form using that but the last time I coded something similar to it I felt like it took a lot of lines of code and was wondering if JQuery supported dialogue box creation and if I could do some similar functionality using it (with hopefully less lines of code since everytime I use jquery instead of standard javascript it seems like it really reduces my codebase). If anyone knows of a resource to learn how to do this I would appreciate a link or a second of your time for some pointers.
Thanks!
I think you are looking for something along the lines of the jquery ui dialog.

How to trigger browser's back event/function using JavaScript?

I want to trigger the browser's back functionality through a hyperlink in my page template, using JavaScript (or PHP if possible). Does anyone know how to implement this?
EDIT
Found the solution using JavaScript. Here is the link if anyone needs it.
And here's the code:
Go back
history.back() should do the trick.
window.history.back() documentation at MDN
As an aside, it's bad user experience if you do this unexpectedly on the user. For example, I enter in an invalid credit card number, and you take me back one page, instead of letting me fix the mistake.
So while it's possible to use javascript to manipulate the history stack, it's better to only do so if it makes sense in the context current users actions.

How to trigger saved password autofill in browsers?

I have a web application written in pure JavaScript (no pre-generated HTML except for the document which loads all the JS files).
This app contains a login form which is created dynamically when the document.ready event event is triggered. I trick the browser into displaying the "Remember password?" dialog by posting the login form into a hidden iframe before logging in using ajax (in Firefox the password appears on the saved password list, so this part obviously works) but saved passwords never get filled in after the login screen is loaded again at a later time. The same thing happens in Firefox and Safari.
Is there something I can do or some function I can call to trigger autofill?
UPDATE: autofill works in Safari on initial page load, but not when user logs out and the login form is recreated without a page reload. In Firefox it never works.
In addition to wrap the form elements in a form element, make sure all the input (and maybe even the form) has unique name and id attributes that doesn't change. The name should probably be something descriptive like password for the password etc., not really sure to which degree browsers use this info, but "autosuggest"/"magic wand" features may work better if you use a standard name.
And of course you should make sure you're not setting any autosuggest/autofill attributes to false (the js framework might do so for some reason, if you're using any).
A third possibility is that some browsers maybe does autofill before your script loads and writes the form to the page, try making a static html version of the form and see if that works.
The easiest solution (if static forms work) is to force a page reload on logout (you probably do want to discard the "state" of the running javascript after log-out anyway, so refreshing is really a Good Thing)
Some browsers require "form" tag to enable local username & password storage. Had the same problem in AJAX application, and in my case I just added
<form>...</form>
tags.
Can't you use a similar trick - use an iframe to load the form and then when the login form is submitted you, in reality, submit the iframe form , which will contain the saved password.
To get the 'password' to appear in the visible form I think you could measure the length of the password in the iframe form and then fill the visible form's password field with the same number of *.

Dealing with unsaved form data when user closes the browser

I'm having hard time trying to figure out how to auto-save user data in a form when the browser is being closed or user changes the page. The onBeforeUnload event is OK when you want to open a dialog box, but by then it's too late to save the changes (except if you just block the browser in the onBeforeUnload handler long enough for it to pass the request to the server...but I'd rather not do that).
I am sure some of you have had to deal with the unsaved form problem. What do you do? Do you:
let users just lose their changes,
ask them using a modal window if they are sure they did the right thing,
save individual fields on the fly as they change,
or do you have some ultimate method to automagically save the data when it's about to be lost irretrievably?
•ask them using a modal window if they are sure they do the right thing,
Closing a window is an act of cancellation. As the user never actively submitted the form, theres no guarantee that they want the data saved (it may not be correct), and you saving the data could cause problems for the user.
I like your third option:
save individual fields on the fly as they change.
I'm having to deal with a similar situation, and that's what we are doing. The two main things that sell that to me:
Improved user experience - the user
will be impressed by a form that
does not lose changes. They are
'committed' once they are validated.
E.g., he types in a valid email
address, and it is saved instantly,
furthermore he is provided some sort
of feedback for each field that is
successfully been saved (a green
tick for example, appears next to
the field).
No more 'oh crap my browser crashed
and I lost all my info' situations.
Disadvantages: The extra man-hours involved in developing such a solution, and the possibly that it ends up not degrading as nicely as a simpler solution. That said, it is still worth it IMO.
In any browser I have used it in, onBeforeUnload provides you with a modal window which asks the user to confirm whether they want to leave the page or not. You can added your own text warning them that there is unsaved data, to help them decide. You don't want to explicitly save without the user's request, because a) the user did not attempt to save, and b) if you need to throw any validation errors it will be too late as the page is already in the process of navigating away.

Categories