CODEWITHSUNDEEP
phpjqueryhtml
user6369806
user6369806

Reputation:

How do I pass value of a variable in jquery to PHP without submitting form or refreshing the page?

My ajax is this:

$.ajax({
    type: "POST",
    url: 'index.php',
    datatype: 'html',
    data: { password : password}
});

Have been trying to store it in $pword. But it doesn't store. PHP:

if(isset($_POST['password']))
{
    // store session data
    $pword=$_POST['password'];
}

HTML is this:

<input type="password" placeholder="password" id="password" name="password"/>

Please help.

Upvotes: 1

Views: 2220

Answers (6)

Siamak
Siamak

Reputation: 1799

first of all : there is nothing wrong with server side (PHP) and HTML code.

so for jQuery portion : you need to correct a line like i did below:

$.ajax({
            type: "POST",
            url: 'index.php',
            datatype: 'html',
            data: { 
              password : $("#password").val()
              //here i asked jquery to fetch entire value of my html input(with an id of "password") as text(Not an Object) so it gives me the entered text value.
                  }})
                .success(function(data) {                        alert(data.toString());
        });//optional function:runs when server responses to your request

i can leave more detailed help if you explain what exactly you r going to do.

Upvotes: 2

Mihai Matei
Mihai Matei

Reputation: 24276

From jquery documentation the $.ajax request should look like this:

$.ajax({
  method: "POST",
  url: "some.php",
  dataType: 'json',
  data: { name: "John", location: "Boston" }
})
.done(function( msg ) {
  alert( "Data Saved: " + msg );
});

Another suggestion would be to create a button. When pressing it the data will be sent to the PHP file.

<input type="password" placeholder="password" id="password" name="password"/>
<input type="button" id="submit" name="submit" value="submit" />

The jQuery code would be:

$(document).ready(function(){
    $('#submit').click(function(){
        $.ajax({
          method: "POST",
          url: "my-php-file.php",
          dataType: 'json',
          data: { password: $('#password').val() }
        })
        .done(function( msg ) {
          alert( "Data sent: " + msg );
        });
    });
});

Upvotes: 0

Samyappa
Samyappa

Reputation: 531

<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('#password').on('blur',function(){
    var password = $('#password').val();

     $.ajax({
            type: "POST",
            url: 'index.php',
            datatype: 'html',
            data: { password : password
           },
            success: function(data){
            alert(data);
        }

        });


})
})
</script>

<form method="post">
    <input type="password" placeholder="password" id="password" name="password"/>
</form>

Upvotes: 1

Krish R
Krish R

Reputation: 22711

You can use javascript setTimeout function to pass the form value into php page as mentioned below,

I have added a function called passData() inside the setTimeout function, so it calls the passData() function mentioned delay.

HTML:

<input type="password" placeholder="password" id="password" name="password"/>

Javascript:

setTimeout(function() { passData() }, 3000);

function passData(){
   var password = $("#password").val(); 
    $.ajax({
        type: "POST",
        url: 'index.php',
        datatype: 'html',
        data: { password : password}
    }); 
}

Upvotes: 0

dutta
dutta

Reputation: 71

HTML

<input type="password" placeholder="password" id="password" name="password"/>
<input type="button" onclick="sendData()" value="Ok">

Javascript

function sendData(){
   
    $.ajax({
        type: "POST",
        url: 'index.php',
        datatype: 'html',
        data: { password : $("#password").val()}
    }); 
}

Upvotes: 0

Sudharmono
Sudharmono

Reputation: 1

use form.serialize() to send data.

$.ajax({
            type: "POST",
            url: 'index.php',
            datatype: 'html',
            data: form.serialize()
});

Upvotes: 0

Related Questions