Sida 1 av 2

Skriva ut data från MySQL, med Javascript och PHP?

Postat: 3 november 2014, 12:34:52
av hyperion
Ursäkta den luddiga rubriken, kommer inte på något bättre sätt att förklara det.

Jag har problem med att klura ut hur jag ska kunna använda variabeln "serialnumber" som valts i select listan för att sedan skicka den till func.inc.php genom att i PHP anropa en funktion, t.ex. query2() som är definerad som:

Kod: Markera allt

function query2(){
	$query2= mysql_query("SELECT serial, description, is_on FROM DEVICES WHERE serial like '$serialnumber'");
	$myData=mysql_fetch_array($query2)
	echo = $myData;
	}
Har gjort en testsida som finns här: http://level6.se/test/test01.php

Som ni ser visas 'serialnumber' till höger, för vald device ur listan.

Jag vill att det som visas till höger ser ut såhär:

Serial number: 10000001
Description: Test device for demo
ON/OFF: ON

Gärna uppdelat i två kolumner så det ser jämnt och fint ut (tänk Excel)

Koden för denna sida är denna:

Kod: Markera allt

<?php
	include_once 'func.inc.php';
	connect();
?>

<!doctype html>
<html>
<head>
   <title>Test01</title>
   <script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>
   <script type="text/javascript">
        function demo(Device) {
        var action = Device.split(' ');
            //alert (action[0]);
        var serialnumber = action[0];
        document.querySelector('#right_content').innerHTML = serialnumber;
            //window.location.href = "test01.php?serialnumber=" + serialnumber;
     //       $(document).ready(function(){
    //function post(){
      //  $.ajax({
        //    type:"POST",
          //  url:"session.php",
            // data:{serialnumber: serialnumber},
            // success:function(data){
               // $("#right_content").html(data);
        //    }
    //    });
//    }
  //  post();
// });
        }
    </script>
   <style type="text/css">
   html, body {
    margin: 0;
    color: #E4E4E4;
    padding: 0;
    width: 800px;
    height: 100%;
    display: table;
}
   .auto-style2 {
	   font-size: large;
   }

   </style>
</head>
    <body bgcolor="#2a2a2b">
    <header class="auto-style2">
    	<h1>
    	<strong>Test01</strong></h1>
	</header>
			<div id="left_content" style="width: 40%; height: 400px; background-color: #2a2a2b; display: inline-block; text-align: left; float: left">
			<form>
			<label for="Device">Device</label>
				<select type="text" id="Device" name="Device" onchange="demo(this.value)">    
                <!--<select name="devices">-->
					<?php query() ?>
				</select>
					<?php close() ?>

        	</form><br><br>
        	</div>
        	
			<div id="right_content" style="width: 60%; height: 400px; background-color: #2a2a2b; display: inline-block; text-align: left; float: left">			
			</div>
			
			<br>
			<br>
		</body>
</html>

Jag undrar alltså hur jag ska få över variabeln 'serialnumber' från Javascript till func.inc.php utan att behöva använda GET, vilket laddar om sidan och därmed även laddar om select listan.

Sen undrar jag även hur man gör för att visa den data jag får ut från query2 på det sätt jag vill på höger sida på hemsidan.

Det är inte så noga med hur det ser ut, funktion före form!

Väldigt tacksam för hjälp då jag snurrar ihop det helt för mig när jag försöker mig på detta. Inte så konstigt kanske eftersom det är PHP blandat med javascript blandat med html och jag inte är programmerare :) Men jag har ju lyckats komma såhär långt iaf så det borde gå att lösa med lite hjälp (hoppas hoppas)

/Daniel S

Re: Skriva ut data från MySQL, med Javascript och PHP?

Postat: 3 november 2014, 13:37:05
av LarryXz
Har jag förstått rätt i att du försöker hämta data från en databas baserat på vad som väljs i en select för att sedan presentera resultatet utan att ladda om sidan?

Re: Skriva ut data från MySQL, med Javascript och PHP?

Postat: 3 november 2014, 13:38:54
av hyperion
Japp. Ungefär som jag redan nu gör, fast nu tar jag bara en del av det som visas i select listan och visar det. Det som visas i listan är redan från samma mySQL databas, men jag kan inte klura ut hur jag överför variabler från JS till PHP osv. Hoppas min förklaring går att förså

Re: Skriva ut data från MySQL, med Javascript och PHP?

Postat: 3 november 2014, 13:54:13
av LarryXz
I princip den här koden använder jag för att hämta data utan att ladda om sidan

Kod: Markera allt

<script type='text/javascript' src='http://code.jquery.com/jquery-1.4.2.js'></script>
<script>
function getData(device)
{
	var xmlhttp = new XMLHttpRequest();
	xmlhttp.onreadystatechange=function()
	{
		if (xmlhttp.readyState==4 && xmlhttp.status == 200)
   		{
   			document.getElementById("data").innerHTML = xmlhttp.responseText;
    	}
  	}
	xmlhttp.open("GET","getdata.php?d=" + device, true);
	xmlhttp.send();
}
</script>
getdata.php hämtar sedan data ur databasen baserat på vad den får i $_REQUEST["d"].

Re: Skriva ut data från MySQL, med Javascript och PHP?

Postat: 3 november 2014, 15:26:41
av hyperion
Tack, men jag får inte till det ändå.
Har fixat så getData.php ger mig den data jag vill ha med en radbrytning mellan varje variabel:
http://level6.se/test/getData.php?d=10000001

Men att anropa detta och få den datan att visas i <div id="right_content"></div> har jag inte lyckats med.

Gör säkert fler en ett fel när jag försöker lägga in ditt exempel i min kod:

Kod: Markera allt

<?php
	include_once 'func.inc.php';
	connect();
?>

<!doctype html>
<html>
<head>
   <title>Test01</title>
   <script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>
   <script type="text/javascript">
        function demo(Device) {
        var action = Device.split(' ');
            //alert (action[0]);
        var serialnumber = action[0];
        //document.querySelector('#right_content').innerHTML = serialnumber;
        var xmlhttp = new XMLHttpRequest();
        xmlhttp.onreadystatechange=function()
        {
        if (xmlhttp.readyState==4 && xmlhttp.status == 200)
        {
            document.getElementById("data").innerHTML = xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","getData.php?d=" + serialnumber, true);
    xmlhttp.send();
            //window.location.href = "test01.php?serialnumber=" + serialnumber;
     //       $(document).ready(function(){
    //function post(){
      //  $.ajax({
        //    type:"POST",
          //  url:"session.php",
            // data:{serialnumber: serialnumber},
            // success:function(data){
               // $("#right_content").html(data);
        //    }
    //    });
//    }
  //  post();
// });
        }
    </script>
    <script type='text/javascript' src='http://code.jquery.com/jquery-1.4.2.js'></script>
<script>
function getData(Device)
{

}
</script>
   <style type="text/css">
   html, body {
    margin: 0;
    color: #E4E4E4;
    padding: 0;
    width: 800px;
    height: 100%;
    display: table;
}
   .auto-style2 {
	   font-size: large;
   }

   </style>
</head>
    <body bgcolor="#2a2a2b">
    <header class="auto-style2">
    	<h1>
    	<strong>Test01</strong></h1>
	</header>
			<div id="left_content" style="width: 40%; height: 400px; background-color: #2a2a2b; display: inline-block; text-align: left; float: left">
			<form>
			<label for="Device">Device</label>
				<select type="text" id="Device" name="Device" onchange="demo(this.value)">    
                <!--<select name="devices">-->
					<?php query() ?>
				</select>
					<?php close() ?>

        	</form><br><br>
        	</div>
        	
			<div id="right_content" style="width: 60%; height: 400px; background-color: #2a2a2b; display: inline-block; text-align: left; float: left">			
			</div>
			
			<br>
			<br>
		</body>
</html>

Re: Skriva ut data från MySQL, med Javascript och PHP?

Postat: 3 november 2014, 15:31:50
av hyperion
Jodå jag fixade det :)

Hade inte fattat att jag behövde <p id="data"></p>

Tack för hjälpen!

Re: Skriva ut data från MySQL, med Javascript och PHP?

Postat: 3 november 2014, 19:11:32
av hyperion
Hoppas kunna få besvära om lite mer hjälp :shock:

http://level6.se/test/test02.php

Nu när jag får fram den data jag vill ha, så behöver jag ett sätt att växla värde på "Relay" för vald "Device"

Vill egentligen inte ha en radio button.

Optimalt vore en knapp med texten "Turn relay ON" om värdet på "Relay" är OFF och tvärt om. Extra bra om man kan få till en "alert" ruta med lite text och en Yes och en No knapp för att bekräfta att man verkligen vill slå på respektive av "Relay"

Koden som den är nu:

Kod: Markera allt

<?php
	include_once 'func.inc.php';
	connect();
?>

<!doctype html>
<html>
<head>
   <title>Test02</title>
   <script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>
   <script type="text/javascript">
        function demo(Device) {
        var action = Device.split(' ');
            //alert (action[0]);
        var serialnumber = action[0];
        var xmlhttp = new XMLHttpRequest();
        xmlhttp.onreadystatechange=function()
        {
        if (xmlhttp.readyState==4 && xmlhttp.status == 200)
        {
            document.getElementById("data").innerHTML = xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","getData.php?d=" + serialnumber, true);
    xmlhttp.send();
        }
    </script>
    <script type='text/javascript' src='http://code.jquery.com/jquery-1.4.2.js'></script>
<script>
function getData(Device)
{

}
</script>
   <style type="text/css">
   html, body {
    margin: 5px;
    color: #E4E4E4;
    padding: 0;
    width: 800px;
    height: 100%;
    display: table;
}
   .auto-style2 {
	   font-size: large;
   }

   </style>
</head>
    <body bgcolor="#2a2a2b">
    <header class="auto-style2">
    	<h1>
    	<strong>Test02</strong></h1>
	</header>
			<div id="left_content" style="width: 40%; height: 400px; background-color: #2a2a2b; display: inline-block; text-align: left; float: left">
			<br>
			<form>
			<label for="Device">Device</label>
				<select type="text" id="Device" name="Device" onchange="demo(this.value)">
					<?php query() ?>
				</select>
					<?php close() ?>

        	</form>
        	<br>
        	<br>
        	</div>
        	
			<div id="right_content" style="width: 60%; height: 400px; background-color: #2a2a2b; display: inline-block; text-align: left; float: left">
			<p id="data" style="width: 60%; height: 400px; background-color: #2a2a2b; display: inline-block; text-align: left; float: left">
			<b>Serial number:</b>
			<br>
			<b>Description:</b>
			<br>
			<b>Relay</b>
			</p>
			<br>
			<form name="input" action="/test/getData2.php" method="get">
			<input type="radio" name="relay_config" value="1024" checked>
			Turn relay ON
			<br>
			<input type="radio" name="relay_config" value="127">
			Turn relay OFF
			<br>
			<input type="submit" value="Submit">
			</form>
			
			</div>
			
			<br>
			<br>
		</body>
</html>
Hoppas på lika grym hjälp som tidigare ;)

Re: Skriva ut data från MySQL, med Javascript och PHP?

Postat: 3 november 2014, 20:07:34
av sodjan
En sak som jag såg som du i och för sig inte direkt har frågat om, men i alla fall... :-)

> $query2= mysql_query("SELECT serial, description, is_on FROM DEVICES WHERE serial like '$serialnumber'");

Stoppar inte det där in i princip vad som helst som strängen "$serialnumber" råkar innehålla?
Har du kollat på "parameter binding"? Med dessa undviker man risker för "SQL injection".

Re: Skriva ut data från MySQL, med Javascript och PHP?

Postat: 3 november 2014, 20:36:46
av hyperion
Fast jag läser ju endast ut data med SELECT.

Så jag läser ut de tre variablerna: serial, description, is_on, men endast på den rad där kolumn serial är exakt lika som variabeln $serialnumber

Så även om jag uppdaterade värdet i kolumn is_on så hade jag endast gjort det om det fanns en rad där kolumn serial är exakt lika som variabeln $serialnumber.

Re: Skriva ut data från MySQL, med Javascript och PHP?

Postat: 3 november 2014, 20:39:58
av Nerre
Spelar ingen roll för SQL injection, med SQL injektion kan nån stoppa in data där som gör att det blir två kommandon, en SELECT följt av en DELETE t.ex.

http://www.w3schools.com/sql/sql_injection.asp

Re: Skriva ut data från MySQL, med Javascript och PHP?

Postat: 3 november 2014, 21:24:53
av hyperion
Ah då är jag med. Hade jag inte ens tänkt på :)

Som tur är så är detta endast för att demonstrera en pryl som skickar data till en MySQL databas och visa hur enkelt och smidigt det är att få fram denna data och ändra en parameter. Hur användare av denna pryl sedan väljer att skriva sin kod för att läsa och skriva data till databasen är upp till dom.

Om databasen blir korrupt/saboterad så gör det inte så mycket. prylen fortsätter att skicka data innehållande sitt unika serienummer så att så fort databasen har nollställts så kommer data att fyllas på igen.

Tack för tipsen dock.

Re: Skriva ut data från MySQL, med Javascript och PHP?

Postat: 3 november 2014, 21:31:42
av sodjan
Och som den sidan säger: "The only proven way to protect a web site
from SQL injection attacks, is to use SQL parameters."

Vad händer om du ändrar :

> http://xxxxx/test/getData.php?d=10000001
till:

> http://xxxxx/test/getData.php?d="100000 ... 20DEVICES"

?

Re: Skriva ut data från MySQL, med Javascript och PHP?

Postat: 3 november 2014, 21:35:19
av hyperion
Tack för att du skrev det i en så fin länk också.................... :shock:

Som sagt, bara ett demo, inget som kommer vara live på internet eller ens något intranet.

Re: Skriva ut data från MySQL, med Javascript och PHP?

Postat: 3 november 2014, 21:42:47
av sodjan
Tja, det är ju inte *mitt* problem... :-)
Och jag vet ju inte om det "fungerar" med just din databas.

EDIT: Nu är de i alla fall inte direkt klickbara...

Re: Skriva ut data från MySQL, med Javascript och PHP?

Postat: 3 november 2014, 21:44:33
av hyperion
Nä det är inte ditt problem, och jag vill inte testa om det fungerar även om det är snabbt att återställa en tabell med 3 kolumner och som innehöll 3 rader påhittad data. Tog bort getData.php