How can store password on browser when html form submiting with $.post

Question

I created a form for SignIn. Since I don't want to refresh the page when the form is submitted, I used the $.post method to send data to a database and receive that.

and I have a problem that browser don't save password if they want save that because form don't be submitted in usual way, I thought maybe cookie is good way but i think it's not safe.

$.post example for login

function formsubmited(form, p, username) {
    $.post("process_login.php", {username: username.value, p: p.value},
            function(response) {
                if(response == 'login')
                {
                      // do something
                }
            }
});

HTML form Sample

<form name="form_login">
  <input name="username"/>
  <input type="password" name="password"/>
  <input type="button" value="login" onclick="formsubmited(this.form, this.form.password, this.form.username);" />
</form>

how can store password on browser when form is submitting in this way? is there any way? or i should use cookies?

Why wouldn't there be a session cookie set when you use AJAX for your form submission? You want to pass the password every time and think that's somehow more secure? You can use LocalStorage for this task, but if you want a secure answer you should provide more information. What is this form for? What is returned? How are sessions handled, if any? What is expected in subsequent requests? — Brad, Sep 07 '15 at 04:30
In your process_login.php script, set `$_SESSION["password"] = $_POST["password"]` and `$_SESSION["username"] = $_POST["username"] `. This way you can access `$_SESSION[]` variables after a user has logged in — Notaras, Sep 07 '15 at 04:30
@kapetanios I think it's good offer, please explain more about send and rcieve data with $_SESSION in Answer section, Thanks — MojtabaSh, Sep 07 '15 at 04:39
have you heard about $_SESSION before? i'll write an answer if you have, but if not, i'll encourage you to do a google search because there are many online information sources that would do a better job explaining it than me — Notaras, Sep 07 '15 at 04:41
yes of course i heard about that and i reading more in web pages. but i would like you wrote in answer section and i accepted your answer, just that — MojtabaSh, Sep 07 '15 at 04:54

score 1 · Accepted Answer · answered Sep 07 '15 at 05:10

1

The case of the problem is that you are using input type="button" and the browser save password don't get triggered on the above input type. Use input type="submit"

Just do one change in this line

<input type="button" value="login" onclick="formsubmited(this.form, this.form.password, this.form.username);" />

Don't use button , use submit

So make it as below :

<input type="submit" value="login" onclick="return formsubmited(this.form, this.form.password, this.form.username);" />

and add return false at the end of the function , so that form don't get sumbitted.

answered Sep 07 '15 at 05:10

sanjeev

4,405
2
19
27

thanks for your answer @sanjeev I changed to submit type my input tag and also return false at the end of formsubmited() method,It do save password in browser but it will submit page and browser will refresh to process_login.php – MojtabaSh Sep 07 '15 at 05:17
have you added `return false` at the end of function if yes trying adding at the top of the function (Just for testing) , if it work out then problem is inside the post request – sanjeev Sep 07 '15 at 05:18
1

Did you used `onclick="return formsubmited(this.form, this.form.password, this.form.username);"` , note the use of return – sanjeev Sep 07 '15 at 05:24
many thanks @sanjeev it doing work in Firefox but i don't know why it don't work in Chrome – MojtabaSh Sep 07 '15 at 05:36
chrome , doesn't work that way, a workout for that can be found in this http://stackoverflow.com/questions/5430129/how-to-make-chrome-remember-password-for-an-ajax-form , in chrome 'Save password' is triggered after it is redirected to the page by submitting the form which contains input text field with attribute name='username' and input password field with attribute name='password'. – sanjeev Sep 07 '15 at 05:42

score 1 · Answer 2 · answered Sep 09 '15 at 00:06

This is an elaboration of my comment so you can understand.

What you are doing is making a post request to a php script like so:

$.post("process_login.php", {username: username.value, p: p.value},

If you want to do it using javascript, i would personally change it to do this:

function formsubmited() {
    var username = document.getelementsbyname("username").value;
    var p = document.getelementsbyname("password").value;
    $.post("process_login.php", {username: username, p: p},
        function(response) {
            if(response == 'login')
            {
                  // do something
            }
        }
}

And then edit your html so it looks a bit cleaner like this:

<input type="button" value="login" onclick="formsubmited();" />

Now in your PHP script, you need to store the POST data in memory so it can be used at later stages. One of the best ways to do this is by using the $_SESSION[] array.

So your PHP script will look like this

<?php
   session_start();
   //On the server side, you can access data you have sent there in the $_POST[] array. 
   //The key you specify in the array has the exact name as the parameter you pass in 
   //javascript:
   $inputtedUsername = $_POST["username"];
   $inputtedPassword = $_POST["p"];
   //first do a check to determine if the username and password are correct
   //add your code here:
   //....

Once you have added your code to determine if the username and password are correct, you can then proceed to storing your username and password in memory:

    $_SESSION["username"] = $inputtedUsername;
    $_SESSION["p"] = $inputtedPassword;

Now in your javascript code, you are expecting the script to return login keyword to determine that the login process was successful

  //basically you'll need to do something like this
  if($yourloginboolean == true){
      echo "login";
  }else{
     echo "error";
  }
  ?>

Now in future, should you wish to use $_SESSION["username"] or $_SESSION["p"] in any future PHP code, simply just use it as you would any other variable.

Hope this helps

score 0 · Answer 3 · answered Sep 07 '15 at 05:14

0

Use PHP to set a session, this will store the password on the server and can be called each time it is required, e.g. something like..

session_start();
$_SESSION['p']=$_POST['p'];

answered Sep 07 '15 at 05:14

nathan

149
1
1
10

How can store password on browser when html form submiting with $.post

3 Answers3