Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Pass javascript variable to php with ajax and the result doesn't show anything

This is my code and i want to pass javascript variable with ajax to php when i click submit button then the result doesn't show var_data variable from javascript What code is wrong? This is edit order one before everybody help me

 <!DOCTYPE html>
<html>
<head>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script>
        $(document).ready(function() {
            $('#sub').click(function() {
                var var_data = "Hello World";
                $.ajax({
                    url: 'http://localhost/ajax/PassVariable.php',
                    type: 'GET',
                     data: { var_PHP_data: var_data },
                     success: function(data) {
                         // do something;

                     }
                 });
             });
         });
 </script>

 </head>
 <body>

 <input type="submit" value="Submit" id="sub"/>

 <?php 
   $test = $_GET['var_PHP_data'];
     echo $test;
 ?>
 </body>
 </html>

and this is source code now

 <?php
     if (isset($_GET['var_PHP_data'])) {
       echo $_GET['var_PHP_data'];
     } else {
     ?>
     <!DOCTYPE html>
     <html>
       <head>
            <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script> 
            <script src="http://malsup.github.com/jquery.form.js"></script> 
         <script>
             $(document).ready(function() {
                 $('#sub').click(function() {
                     var var_data = "Hello World";
                     $.ajax({
                         url: 'http://localhost/test.php',
                         type: 'GET',
                          data: { var_PHP_data: var_data },
                          success: function(data) {
                              // do something;
                             $('#result').html(data)
                          }
                      });
                  });
              });
         </script>
       </head>
       <body>
         <input type="submit" value="Submit" id="sub"/>
         <div id="result">
       </body>
     </html>
    <?php } ?>

this statement if(isset($_GET['var_PHP_data'])) output false and then show Hello World What should i do to do for isset($_GET['var_PHP_data']) is true?

like image 372
Monogot Avatar asked May 08 '13 06:05

Monogot


3 Answers

Your solution has PHP issues: you don't check if the data exists, and also, you don't do anything with the result. I've modified the script to do the following:

  1. Check if the var_PHP_data var is set (in PHP, on the server).
  2. If yes, just send a blank text response containing that data.
  3. If no, then draw the form and everything else.
  4. In the form, I've created a #result div.
  5. Ajax response will be shown in this div.

Also make sure that you host the script at localhost and that it is called test.php. To make sure this is resilient, you can change the Ajax URL to <?php echo $_SERVER['PHP_SELF'];?> to make sure that you'll hit the correct script.

<?php
    if (isset($_GET['var_PHP_data'])) {
      echo $_GET['var_PHP_data'];
    } else {
    ?>
    <!DOCTYPE html>
    <html>
      <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js">
        <script>
            $(document).ready(function() {
                $('#sub').click(function() {
                    var var_data = "Hello World";
                    $.ajax({
                        url: 'http://localhost/test.php',
                        type: 'GET',
                         data: { var_PHP_data: var_data },
                         success: function(data) {
                             // do something;
                            $('#result').html(data)
                         }
                     });
                 });
             });
        </script>
      </head>
      <body>
        <input type="submit" value="Submit" id="sub"/>
        <div id="result">
      </body>
    </html>
    <?php } ?>
like image 113
Zlatko Avatar answered Oct 10 '22 19:10

Zlatko


Try jQuery Form its this will help to solve many problems.

For you question: try url without domain name, add tags 'form', change event click to submit, add data type

like image 34
Vitmais Avatar answered Oct 10 '22 18:10

Vitmais


what are the contents of PassVariable.php ? if is the same where you have they jquery bit wont work coz php will print all the page again, if the file is different try

success: function(data) {
                     alert('databack = '+ data);

                 }
like image 23
user2361197 Avatar answered Oct 10 '22 19:10

user2361197