_popup_forgot_password.html.erb

<!-- ui-dialog -->
<div id="dialog-password-forget-form">
  <%= form_tag forgot_password_path, :id => "submit-forgot-password" do %>
    <fieldset id="user-email">
      <p>
        <label>Email address<span><%= email_field_tag :email, '', :id => "email" %></span></label>
      </p>
    </fieldset>
  <% end %>
</div>

forgot_password.html.erb

<h1>Password Reset Code Has Been Mailed</h1>
<p>Please check your email account and follow the instructions we mailed to you.</p>

hiddenpass.js

$(function() {

    var email = $( "#email" ),
    allFields = $( [] ).add( email ),

    // This does some regexp checks on the email format and doesn't allow a post until the email is valid.

    function checkRegexp( o, regexp, n ) {
        if ( !( regexp.test( o.val() ) ) ) {
            o.addClass( "ui-state-error" );
            return false;
        } else {
            return true;
        }
    }

    // This is the start of the enter key event
    $( '#email' ).keypress( function( enterkeypressed ) {

        if( enterkeypressed.keyCode == 13 ) {

            var bValid = true;
            allFields.removeClass( "ui-state-error" );
            bValid = bValid && checkRegexp( email, /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i, "eg. ui@jquery.com" );

            if ( bValid ) {    

                // If everything is valid, it will perform a post with the rails form tag ID of submit-forgot-password            
                $.post('/forgot_password', $("#submit-forgot-password").serialize());
                $( "#dialog-password-forget-form" ).dialog("close");

                // This is the first hitch.  In case redirection does not happen, I force redirection to a GET catch all route in rails
                window.location = '/password_reset_code_sent';
                return true;
            } else {
                return false;
            }
            
        }

    });

    $( "#dialog-password-forget-form" ).dialog({
        autoOpen: false,
        modal: true,
        height: 200,
        width: 500,
        title: 'Forgot your password?',
        buttons: {

            // Here is the button event which is handled if the user clicks the button
            "Submit Email": function() {
                
                var bValid = true;
                allFields.removeClass( "ui-state-error" );
                bValid = bValid && checkRegexp( email, /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i, "eg. ui@jquery.com" );

                if ( bValid ) {

                    // Here is the first hiccup with Safari which if I supply a window.location, it will change the location
                    // of the POST to the window.location.  Quirky and strange.  Instead, I send an alert.
                    if( $.browser.safari ){    // Handling Safari Issues because window.location changes post behavior
                        $.post( '/forgot_password', $("#submit-forgot-password").serialize() );
                        $(this).dialog("close");
                        alert('Password Reset Code Has Been Mailed.');
                        return true;
                        
                    } else {
           
                        // Now this works for browsers other than safari, only because IE doesn't handle a redirect, I ended 
                        // up having to supply a window.location to force a redirect.  I couldn't use window.location for 
                        // forgot_password because window.location sends a GET and it's expecting POST, so it will throw an error.
                        // I ended up having to update window.location to send it to a GET catch all route '/password_reset_code_sent'
                        // which looks just like the erb template for forgot_password.html.erb.
                        $.post( '/forgot_password', $("#submit-forgot-password").serialize() );
                        $(this).dialog("close");
                        window.location = '/password_reset_code_sent';
                        return true;

                    }
                }
            },
            "Nevermind, I remember it": function() {
                $(this).dialog("close");
            }
        }

    });

    $( "#open-dialog-forget-password" ).click(function() {
        $( "#dialog-password-forget-form" ).dialog( "open" );
    });

});

routes.rb

# This will create a password reset code for the user and mail them instructions
# we'll process this as a post request

match '/forgot_password' => "sessions#forgot_password", :as => "forgot_password", :via => :post

sessions_controller.rb

  # FORGOT_PASSWORD /forgot_password(:format) via POST request
  def forgot_password
      # let's find the user by the email params specified
      user = User.find_by_email(params[:email])
      respond_to do |format|
        # if the email address matched a user's email address then the user
        # object should be valid and processing will continue, else it will
        # redirect the requester to the login path and supply a message.
        if user
          # Send the user id to the user model's forgot_password method
          user.forgot_password(user)
          format.html  
          format.xml  { render :xml => @user }
        else
          # The user provided an incorrect email address.
          format.html { redirect_to(login_path, :notice => 'The email address you provided could not be found.') }
          format.mobile { redirect_to(mobile_forgot_password_path, :notice => 'The email address you provided could not be found.') }
          format.xml  { render :xml => user.errors, :status => :unprocessable_entity }
        end
      end
  end