Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Feb 2009
    Posts
    68
    Thanks
    12
    Thanked 0 Times in 0 Posts

    Translate this regular prompt using JQuery Plugin for prompts?

    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:

    Code:
    	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!

  • #2
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,479
    Thanks
    6
    Thanked 981 Times in 954 Posts
    The demo’s source code shows
    PHP Code:
    $("#prompt_button").click( function() {
        
    jPrompt('Type something:''Prefilled value''Prompt Dialog', function(r) {
            if( 
    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( 
    == 'your password'alert('You entered ' r);
            else 
    alert('wrong password');
        });
    }); 

  • Users who have thanked VIPStephan for this post:

    shelzmike (09-26-2011)

  • #3
    New Coder
    Join Date
    Feb 2009
    Posts
    68
    Thanks
    12
    Thanked 0 Times in 0 Posts
    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

  • #4
    New Coder
    Join Date
    Feb 2009
    Posts
    68
    Thanks
    12
    Thanked 0 Times in 0 Posts
    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:

    Code:
    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


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •