Warning: Undefined variable $JSONstring in /var/www/u3315689/data/www/snip_php/_str28.php on line 85

Warning: Undefined variable $dataFromMySql in /var/www/u3315689/data/www/snip_php/_str28.php on line 85

Retrieve data from MySql table, using JSON, depending on the selected value

Show all: Calories Carbohydrates Sugar Protein Fat Fiber Cholesterol

Example implements JSON. JSON is collection of name/value pairs in text format. Virtually all modern programming languages support them in one form or another.
1) Quiery string (default-"all") is sent to server php file
xmlhttp.send("x="+quiery string);
2) Php file addresses MySql database and fetches corresponding data.
Data ,received from database would be encoded as JSON
= json_encode();
3) XMLHttpRequest parses received data
JSON.parse(this.responseText);
4) Table would be built in a loop

function change_myselect(sel) {
  const dbParam = JSON.stringify({table:sel,limit:20});
  const xmlhttp = new XMLHttpRequest();
  xmlhttp.onload = function() {
    myObj = JSON.parse(this.responseText);
    text = "< table border='1'>"

	for(var y=0;y< myObj.name[y].length;y++){
      if(sel=='all'){
	  if(y==0){text += "<tr style='font-weight: bold;'><td>Product</td>
	  <td>Calories</td><td>Carbohydrates</td><td>Sugar</td>
	  <td>Protein</td><td>Fat</td><td>Fiber</td><td>Cholesterol</td></tr>";}
	  text += "<tr><td>" + myObj.name[y] + "</td><td>" + myObj.Calories[y] + "</td>
	  <td>" + myObj.Carbohydrates[y] + "</td><td>" + myObj.Sugar[y] + "</td>
	  <td>" + myObj.Protein[y] + "</td><td>" + myObj.Fat[y] + "</td>
	  <td>" + myObj.Fiber[y] + "</td><td>" + myObj.Cholesterol[y] + "</td></tr>";}
	  else{
	  if(y==0){text += "<tr style='font-weight: bold;'><td>Product</td><td>"+sel+" (g)</td></tr>";}
	  text += "<tr><td>" + myObj.name[y] + "</td><td>" + myObj[sel][y] + "</td></tr>";}
	  }

    text += "</table>"    
    document.getElementById("demo").innerHTML = text;
  }
  xmlhttp.open("POST", "json_encode.php", true);
  xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

  xmlhttp.send("x=" + sel);
}