CODEWITHSUNDEEP
phpajax
Matthias Quintero
Matthias Quintero

Reputation: 51

Storing value from an html text input in a PHP variable using AJAX

I'm trying to obtain the value in an html text input in real time (without submitting a form) and store it in a PHP variable. I'm doing all of this within the same php file (home.php). The script doesn't return any errors. However, when I try to access the value through the global POST array, I get an error that says the index 'query' is undefined.

Any help would be greatly appreciated.

<script>
    function getQuery(){
    $('#query').change(function(){
        $.ajax({
            type: "POST",
            url: "home.php",
           data: {query:$(this).val()}
        });
    });
    }
}
</script>

<input name='searchBar' type='text' onChange='getQuery();' size='100' id='query'></input>

<?php
    $x = $_POST['query'];
    echo $x;
?>

Upvotes: 0

Views: 754

Answers (1)

Joseph_J
Joseph_J

Reputation: 3669

UPDATED

home.php

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script>

  $(document).ready(function(){

    $("#query").on('keyup', function(){

        $.ajax({

          type: 'POST',
          url: 'search.php',
          data: {query:$(this).val()},
          success: function(data) {

            $("#display").html(data);

          }

        });
    });

  });

</script>


<input id="query" name="query" type="text" size="100"></input>

<div id="display"></div>

search.php

<?php
$x = $_POST['query'];
echo 'You made it to your search page.  x = ' . $x;
?>

Upvotes: 1

Related Questions