7
\$\begingroup\$

I have built a "reset and confirm password" section on a site. It works great. I just have this suspicion that maybe it isn't the most efficient way. I am relatively new to jQuery but I can usually make things work well. I am just wanting to make sure I am doing them right.

Any suggestions are appreciated.

/////////////// RESET PASSWORD  /////////////////////
$('#reset_password').click(function reset_password(){
    //Enter a password input field a button
    $('#new_pass_field').html('<input type="text" id="new_password" name="new_password"><button id="submit_new_pass">Submit New Password</button>');
    // Bind a click to the button
    $('#submit_new_pass').bind('click', function submit_new_pass (){
        // When clicked get val of the new_password field. 
        $get_val = $("#new_password").val();
        // Hide the new_pass field and button so the confirm field and button can be entered. 
        $('#new_pass_field').hide("fast").html('<input type="text" id="password" name="password"><button id="confirm_new_pass">Confirm New Password</button>');
        // Bind click to that confirm button
        $('#confirm_new_pass').bind('click', function confirm_new(){ 
            // Get val of the confirm pass field
            $get_confirm_val = $("#password").val();
            // Check valdation if 2 passwords match
            if($get_val == $get_confirm_val){
                // If they match send to DB and encrypt. 
                $.get(uri_base +'/AJAX/update_password/admin_users/'+$get_confirm_val+'/'+Math.random(), function(msg){
                    //If returns true then send msg password changed. and hide the password row. 
                    if(msg){
                        $("#err_password").html("Your Password has been changed.").queue(function(){
                            setTimeout(function(){
                                $("#err_password").dequeue();
                            }, 3000);
                        })
                        $('#reset_pass_results').slideUp("slow");
                        $('#new_pass_field').hide("fast").html('');
                    }else{
                        // Error in the DB
                        $("#err_password").html("There was an error. Your password was not changed.");
                    }
                });
            }else{
                // Passwords didn't match now reset the clicks to try again and hide the error
                $("#err_password").html("Your Passwords didn't match!").delay(3000).fadeOut("slow");
                $('#confirm_new_pass').bind('click', confirm_new);
                $('#reset_password').bind('click', reset_password);
            }
            return false;
        });
        // Show the password field
        $('#new_pass_field').show("fast");
        return false;
    });
    // Show initial field and button. 
    $('#reset_pass_results').slideDown("slow", function(){
        $('#new_pass_field').show("fast");                          
    });
    return false;
});
\$\endgroup\$
1
  • 4
    \$\begingroup\$ Just in glancing, I would not use a GET request to change a user's password - this leaves you open for CSRF attacks. Use a POST and pass along a user-specific 'secret' token, as shown in the Prevention section. \$\endgroup\$ Commented Mar 27, 2011 at 2:06

1 Answer 1

4
\$\begingroup\$

Looks fine to me but one way to write a lot less code for these relatively simple ajax calls is to use the Jquery Form plugin that converts a form tag to an ajax call. I believe you'll find it a huge time save going forward.

\$\endgroup\$

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.