0

First time asking a question :)

So I have an HTML page that takes number values from dropdown menus and tries to use them to populate a Google Chart. This is done using a Javascript function

function displayChart() {
    var sct = document.getElementById("sct").value;
    var ind = document.getElementById("ind").value;
    var spc = document.getElementById("spc").value;
    var sub = document.getElementById("sub").value;

    if ( sub == "" ) {
        document.getElementById( "myChart" ).innerHTML = "";
        return;
    } else {
        if ( window.XMLHttpRequest ) {
            // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp = new XMLHttpRequest();
        } else {
            // code for IE6, IE5
            xmlhttp = new ActiveXObject( "Microsoft.XMLHTTP" );
        }
        xmlhttp.onreadystatechange = function () {
            if ( this.readyState == 4 && this.status == 200 ) {
                document.getElementById( "myChart" ).innerHTML = this.responseText;
            }
        };

        xmlhttp.open( "GET", "chart.php?sct="+sct+"&ind="+ind+"&spc="+spc+"&sub="+sub, true );
        xmlhttp.send();
    }
}

This links to a php page that uses the variables being passed as part of a MySQL statement:

$sct = intval[ 'sct' ];
...
...
...

function get_transactions() {
    $purchases_sql_stmt = "SELECT CT_Purchases FROM Company_Transactions WHERE CT_Sector = $sct && CT_Industry = $ind && CT_Specoality = $spc && CT_Subspeciality = $sub";
}

What I was hoping is that this function this would be called in a script tag in the PHP file that contains all the neccessary code to create a Google Chart.

// Load the Visualization API and the piechart package.
google.charts.load( 'current', {
    'packages': [ 'bar' ]
} );

// Set a callback to run when the Google Visualization API is loaded.
google.charts.setOnLoadCallback( drawChart );

// Callback that creates and populates a data table, 
// instantiates the pie chart, passes in the data and
// draws it.

function drawChart() {
    // Create the data table.

    var data = <?php echo json_encode( get_transactions() ); ?>;
    var years = data[ 0 ];
    var sales = data[ 1 ];
    var purchases = data[ 2 ];
    var tableArray = new Array();

    for ( var i = 0; i < data[ 0 ].length; i++ ) {
        tableArray.push( new Array() )
        tableArray[ i ].push( [ Number( years[ i ] ), Number( sales[ i ] ), Number( purchases[ i ] ) ] )
    }

    var table = new google.visualization.DataTable();
    table.addColumn( 'number', 'Year' );
    table.addColumn( 'number', 'Sales' );
    table.addColumn( 'number', 'Purchases' );

    for ( var i = 0; i < tableArray.length; i++ ) {
        table.addRow( tableArray[ i ][ 0 ], tableArray[ i ][ 1 ], tableArray[ i ][ 2 ] );
    }


    // Set chart options
    var options = {
        chart: {
            title: 'Sales for Mens Clothing Stores',
        },
        hAxis: {
            format: ''
        },
        width: 640,
        height: 320
    };

    // Instantiate and draw our chart, passing in some options.
    var chart = new google.charts.Bar( document.getElementById( "columnchart_material" ) );
    chart.draw( table, google.charts.Bar.convertOptions( options ) );
}

The thing is, I've tried using this exact code on a separate PHP page where the values in the MySQL Statement have been hardcoded to create results and the whole thing works perfectly. I've also been able to determine that it's not a problem calling the page because I've been able to perform echoes inside of it. The problem appears to be that the script tags in chart.php are being ignored after the page is called using xmlhttp.open(). Is there a specific reason for this, and if so, how do I fix it? Thanks a lot :)

2
  • Does this help? stackoverflow.com/questions/4971254/… Commented Apr 10, 2018 at 22:28
  • The reason that OP's function works if he hardcodes the value in is because he is not globalizing any get varibales inside the function (or passing them as params) and not declaring the variables properly at the start. My answer below displays how to fix these 3 issues. It is vital that these issues are fixed first so we can properly debug any issues after...but these issues should not be ignored. Commented Apr 10, 2018 at 22:39

1 Answer 1

0

you should not be using javascript in the PHP file that is called through XHR/ajax in JS! Instead, use PHP to do the same thing in your PHP file, or evaluate sent/received data on the JS side separately. The JS scripts inside your PHP file(that is called by Xmlhttprequest) will not act as expected. You are also not retrieving any of the GET variables, which is why your queries aren't working.

   $sct = intval[ 'sct' ]; 

This should be:

$sct = $_GET['sct']; 

You are sending all the information over with xmlhttprequest (using $_GET), but don't appear to be setting the variables with $var = $_GET before the SQL.

Also, your function doesn't:

1) Accept the vars as parameters

2) Doesn't globalize the $_GET vars

This means your function (which has SQL in it) cannot currently see (or use, evaluate, etc) any of the variables ($sct for example) above the actual function.

Please update all of this and let me know what you find :)

example...

$sct = $_GET['sct'];
function sqlStuff(){
global $sct;
// sql stuff here... 
}

sqlStuff(); 

example 2...

$sct = $_GET['sct'];
$blah = $_GET['blah'];
function sqlStuff($getVar, $getVar2){
// sql stuff here... 
}

sqlStuff($sct, $blah); 
Sign up to request clarification or add additional context in comments.

2 Comments

I answered his question about his GET variables not being passed to his query
"I've tried using this exact code on a separate PHP page where the values in the MySQL Statement have been hardcoded to create results and the whole thing works perfectly. I've also been able to determine that it's not a problem calling the page because I've been able to perform echoes inside of it." - OP specifically stating that his variables are not going through. And I told him why

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.