Include JS file in PHP file

Question

Tryed to find my answer in many forums, found one main answer but for some reason doesn't work in my case.

Quite new to Web development. I'm trying to write a very simple JS program which consumes a list of products (presented by a JSON string), and returns an HTML table with the products. In order to use DB data, I'm using AJAX. So far I've got two files, a PHP and a JS file.

The page on the server called by the JS file (show.js) is a PHP file called "testmysql.php".

The problem is I've got a shared parameter in both files, and therefore I need to include the JS file in the PHP file.

**"show.js" : **

<html>
<head>
<script>
function showUser(str) {
    if (str == "") {
        document.getElementById("txtHint").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 (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
            }
        };
        xmlhttp.open("GET","testmysql.php?q="+str,true);
        xmlhttp.send();
    }
}
</script>
</head>
</html>

**"testmysql.php" : **

<html>
<head>
<script type="text/javascript" src="show.js"></script>
<style>
table {
    width: 100%;
    border-collapse: collapse;
}

table, td, th {
    border: 1px solid black;
    padding: 5px;
}

th {text-align: left;}
</style>
</head>
<body>


<?php

//Sample Database Connection Script

//Setup connection variables, such as database username
//and password
$hostname="localhost";
$username="root";
$password="";
$dbname="grocery";
$usertable="grocery";
$yourfield = "NAME";
$q = intval($_GET['q']);
//Connect to the database
$connection = mysqli_connect($hostname, $username, $password);
mysqli_select_db($connection, $dbname);
$query="SELECT * FROM user WHERE id = '".$q."'";
$result = mysqli_query($connection,$query);

echo "<table>
<tr>
<th>Name</th>
<th>Price</th>
<th>Amount</th>
</tr>";
if($result){
while($row = mysqli_fetch_array($result)) {
    echo "<tr>";
    echo "<td>" . $row['NAME'] . "</td>";
    echo "<td>" . $row['PRICE'] . "</td>";
    echo "<td>" . $row['AMOUNT'] . "</td>";
    echo "</tr>";
    }
}
echo "</table>";
mysqli_close($connection);
/* 
//Setup our query
//$query = "SELECT * FROM $usertable";

Run the Query
$result = mysqli_query($connection,$query);

//If the query returned results, loop through
// each result
if($result)
{
  while($row = mysqli_fetch_array($result))
  {
    $name = $row["$yourfield"];
    echo "Name: " . $name; 

  }
}
*/
?>
</body>
</html>

The problematic row is script type="text/javascript" src="show.js">, and for some reason it returns the error of Undefined index: q, while q is the shared parameter in both files. Hope my question is comprehensible, appreciate it.

I don't see an `txtHint` id in your code, for one thing. Where is that located? You obviously followed a tutorial but didn't follow it *"to a T"*. and where are you calling `showUser()`? Missing code here. — Funk Forty Niner, Aug 12 '16 at 13:06
http://stackoverflow.com/questions/23740548/how-to-pass-variables-and-data-from-php-to-javascript — Iceman, Aug 12 '16 at 13:13
Also, you're returning HTML, not a JSON string. I don't see JSON anywhere. — Jonnix, Aug 12 '16 at 13:14
are you calling showUser() ? where ? put full code plz if you havent yet. — Mittul Chauhan, Aug 12 '16 at 13:14

score 0 · Answer 1 · answered Aug 12 '16 at 13:14

0

For starters, show.js should not contain any HTML! It should be plain javascript file.

What file do you open in the start? I guess it should be testmysql.php. But on the first page load, when no ajax was called, when noone called js function showUser, page loads without parameters. Thats why you get that $_GET['q'] is empty (undefined index q). Try

if (isset($_GET['q'])) {
    ....
} else {
    do nothing
}

answered Aug 12 '16 at 13:14

Wax Cage

788
2
8
24

But to be completely honest, your code is a complete mess. – Wax Cage Aug 12 '16 at 13:16

score 0 · Answer 2 · answered Aug 12 '16 at 13:22

Like Wax said:

First, remove useless html tags from JS file, your script must be:

function showUser(str) {
   [...]
}

Include this file into a .php file with:

<script type="text/javascript" src="show.js"></script>

Call your function from show.js by

<script type="text/javascript">showUser("your_str");</script>

Finally, take a look on w3schools' chapter to know how to handle a POST/GET request in PHP

Don't hesitate to take a look on many examples available on the Web!

Include JS file in PHP file

2 Answers2