Translate this regular prompt using JQuery Plugin for prompts?

[shelzmike]

Hello all -

I am taking a javascript class and have already finished the requirements of this particular assignment. However, now I am attempting to learn more by going beyond that.

I am trying to replace the standard js prompt() with a JQuery plugin called JQuery Alert Dialogs. http://abeautifulsite.net/blog/2008/...alert-dialogs/


It looks really good and simple to implement but I think my inexperience is hindering me here. I have added all necessary dependencies; however, I am getting weird results:

Ex.

If I have a simple prompt for a username, I have this in js:

	var username = prompt("Enter Username:");
	var password = prompt("Enter password:");
	var valid = validateLogon(username,password);
	if (valid==1) {
		alert("Valid Login. Click OK to continue");
		document.getElementById("welcome").innerHTML = "Welcome, " + username + "!";
		chooseItem();
	} else {
		alert("Incorrect Username and/or Password\nPlease try again");
		logon();
	}
}

If I implement the JQuery Dialogs, using the jPrompt() function (as listed on the site link I gave). Basically what happens is the prompt pops up, but there is an immediate regular js alert stating the Incorrect Username and/or password (from my code).

It is almost as if the js code keeps executing in succession without passing the data (as I never have time to enter it).

I know there are other parameters i.e. jPrompt(message, [value, title, callback])

And I do change my code to implement those; however, I am pretty sure my problem is the callback. I do not know how to use that. The plugin site says:
"These methods do not return the same values as confirm() and prompt(). You must access the resulting values using a callback function. (See the demo for more details.)"

However, I do not understand the demo - it is not very clear.

Can someone help me with this info on how to use the jPrompt() method instead of prompt()?

Thanks!

[VIPStephan]

The demo’s source code shows

PHP Code:

$("#prompt_button").click( function() {
    jPrompt('Type something:', 'Prefilled value', 'Prompt Dialog', function(r) {
        if( r ) alert('You entered ' + r);
    });
}); 


So you just have to use this conditional test to your desire, like:

PHP Code:

$("#prompt_button").click( function() {
    jPrompt('Type something:', 'Prefilled value', 'Prompt Dialog', function(r) {
        if( r == 'your password') alert('You entered ' + r);
        else alert('wrong password');
    });
}); 


[shelzmike]

Okay, that makes it a little clearer to me now. I think I was making it too hard. So essentially, instead of alert('you entered' + r), I could essentially put anything in there that I want to be a next step - i.e. in this case moving to whatever action is next if the login is correct).

I will play around with it and if I have anymore questions, I will post back. Thanks again!

Mike

[shelzmike]

That was actually slightly easier than I had initially thought it would be. I have it working, but have another question regarding best practices in this situation.

To start off, I realize that no credential checking would EVER be implemented like this, but our exercise does not require anything more advanced than this.

So, here is what I have and it works beautifully:

function testLogon(){
	jPrompt("Enter Username:"," ", "Prompt Dialog",
		function(r) {
			if(r == "username") {
			nowPassword();
			} else {
			alert("Nope, that is not right, please try again.");
			testLogon();
			}
	});
}

function nowPassword(){
	jPrompt("Enter Password:"," ", "Prompt Dialog",
		function(r) {
			if(r == "password") {
			chooseItem();
			} else {
			alert("Nope, that is not right, please try again.");
			nowPassword();
			}
	});
}

I am not so sure that this is the most graceful way to handle the wrong answers to loop back around again. Meaning, I currently have it to where if the user or password is entered wrong, I simply call the current function again. I tried to figure out a way to do a While Loop (i.e. while password != password) but it didn't really work out too well. What would be a better solution here?

Thanks again for the help! I have learned a lot so far (mainly that things are not always as complicated as they seem!)

Mike