1

How can I get the value from the html in php? How can I change the ".$x." in php to result which is var click in the JavaScript. Currently, it only display the value ".x." when I click the next button.

php file

<?php

$con=mysqli_connect("localhost","root","password","DB");
// Check connection
if (mysqli_connect_errno())
{
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
$x = 1;

$sql="select * from sentence where id = ".$x." limit 10";

if ($result=mysqli_query($con,$sql))
{
 // Fetch one and one row
while ($row=mysqli_fetch_row($result))
{
$output = $row[1];
}
 // Free result set
 mysqli_free_result($result);
}

mysqli_close($con);
?>

Javascript

function next() {

if(typeof(Storage) !== "undefined") {
    if (sessionStorage.clickcount) {
        sessionStorage.clickcount = Number(sessionStorage.clickcount)+1;
    } else {
        sessionStorage.clickcount = 1;
    }
    document.getElementById("result").innerHTML =  sessionStorage.clickcount;
} else {
    document.getElementById("result").innerHTML = "Sorry, your browser does not support web     
storage...";
}

}
var click = sessionStorage.clickcount;

function nextnext(){
alert(click);
}

Html

 <center><button onclick='next()'>NEXT</button></center>
 <div id="result"></div>
user3773928
  • 53
  • 1
  • 6

3 Answers3

1

you need to either use a post/get or ajax call to send value from client(in ur words - html) to php Your question is not clear. If below is not what you are expecting let me know. I will correct the answer try this:

<form method="GET" action="urPHPFIle.php">
<input type="hidden" value="x_value" name="x" />
<input type="click" value="send" />
</form>

on clicking above the $_GET['x'] value will be equal to x_Value or the value you enter in value attribute of input

<?php

$con=mysqli_connect("localhost","root","password","DB");
// Check connection
if (mysqli_connect_errno())
{
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
$x = 1;

$sql="select * from sentence where id = ".$_GET['x']." limit 10";

if ($result=mysqli_query($con,$sql))
{
 // Fetch one and one row
while ($row=mysqli_fetch_row($result))
{
$output = $row[1];
}
 // Free result set
 mysqli_free_result($result);
}

mysqli_close($con);
?>
wallop
  • 2,510
  • 1
  • 22
  • 39
  • I get this error: "Notice: Undefined index: x ". X suppose to be the sentence retrieve out from then first id of the database and then count.. So 1 to 2 to 3 to 4.....(next each time I click the next button). – user3773928 Aug 22 '14 at 06:59
  • did you click on send and then check? Well x cant be sentence retrieved from database. Even in the example you gave. $result will have your complete response for your query. Can you tell the steps you did to reproduce? – wallop Aug 22 '14 at 07:04
  • I am actually doing a create sentence game. So I have to retrieve the next id(which is the next question) on the same page when user answer the first question correctly. Now I have problem displaying the content out to the next following question. I think is because the $x = 1; which is set into 1 that why it cannot auto increment after I click next? – user3773928 Aug 22 '14 at 07:24
  • well you need ajax or understand concepts of how to move from one page to another using post/get and session in php to solve your problem – wallop Aug 22 '14 at 07:27
  • I do not want it to go the another page, I want it on the same page but the content will change to another question. – user3773928 Aug 22 '14 at 07:30
  • May I know, how can I make the $x into a var, Which is like ++. Currently, if I use $x = 1; it will only show the first sentence in the database. For example, the database have two elements id and sentence. Id 1, the sentence is "how are you", $x = 1 only retrieve how are you. How can I make it such that, the $x will add on? – user3773928 Aug 22 '14 at 08:51
  • right!!! So all the php code gets executed only once when the page is loaded. If you dont want the page to load but get some value from server you use ajax. why dont you use forloop? for($x=1;$X<10;$x++){//your code}. If you increment $x then just $x++ or $x=$x+2 if you want to increment by 2 – wallop Aug 22 '14 at 09:03
  • I've tried adding it in but it can't work. I think is this statement in my php code that have problem . $x = 1; $sql="select * from sen where id = ".$x." limit 10"; I tried using $x++, cannot work as well. – user3773928 Aug 25 '14 at 01:40
  • @user3773928 could send me the entire code somehow? When i am free say in a day or two i will send back the reply.Very busy with work sorry!!! Are u using a forloop while doing $x++ or just $x++ – wallop Aug 26 '14 at 05:53
  • Is okay:) I have send my entire code without the – user3773928 Aug 26 '14 at 06:18
0

do an ajax call 

$.ajax({
   url: "filename.php",
   type: "POST",
   data: { cnt : count},
}).done(function( msg ) {
    // to do here after ajax call 
});

from PHP file

$x = $_POST['cnt'];

there are many ways to do it,.. like storing it in hidden field and posting it. etc.. explore them also

practice2perfect
  • 499
  • 1
  • 4
  • 19
0
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Scramble Game</title>
<script type="text/javascript" src="https://ajax.microsoft.com/ajax/jQuery/jquery-1.4.2.min.js">        
</script>
</head>

<body>
<header>
<h1>Drag in order to create a sentence</h1>
<div id="cardContainer" draggable="true"></div>


<?php

$con=mysqli_connect("localhost","root","password","database");
// Check connection
if (mysqli_connect_errno())
{
echo "Failed to connect to MySQL: " . mysqli_connect_error();
 }
$x = 1;

$sql="select * from sentence where id = ".$x." limit 10";

if ($result=mysqli_query($con,$sql))
 {
// Fetch one and one row
while ($row=mysqli_fetch_row($result))
{
$output = $row[1];
}
 // Free result set
 mysqli_free_result($result);
}

mysqli_close($con);
?>

<div id="adiv" style="font:24px bold; display:block"><p id="demo"></p></div>

<script>

js_var = "<?php echo $output ?>";
var c = ['c1','c2','c3','c4','c5','c6','c7','c8','c9','c10'];
var div_id = ['id1','id2','id3','id4','id5','id6','id7','id8','id9','id10'];
var box_id = ['box1','box2','box3','box4','box5','box6','box7','box8','box9','box10'];
var original = js_var.split("#");
var balls90= js_var.split("#");

var org_txt="";
for (i=0;i<balls90.length;i++){
org_txt=org_txt.concat(original[i]);
}

document.getElementById("demo").innerHTML =  org_txt;


setTimeout(fade_out, 5000);

function fade_out() {
$("#adiv").fadeOut().empty();
}

//look at this function next() {

if(typeof(Storage) !== "undefined") {
    if (sessionStorage.clickcount) {
        sessionStorage.clickcount = Number(sessionStorage.clickcount)+1;
    } else {
        sessionStorage.clickcount = 1;
    }
    document.getElementById("result").innerHTML =  sessionStorage.clickcount;
  } else {
    document.getElementById("result").innerHTML = "Sorry, your browser does not support web 
  storage...";
}

}
var click = sessionStorage.clickcount;


function nextnext(){
alert(click);
}


function getNumbers() {
var player1 = new Array();
balls90.sort(function() {
    return Math.random() - .25;
    document.getElementById("btn_shuffle").onclick = function(){displayDate()};
});


 for (var i = 0; i < balls90.length; i++) {
     document.writeln('<div id='+box_id[i]+' class=box droppable=true ondrop=drop(event)     
ondragover=allowDrop(event)></div>');
 }


for (var i = 0; i < balls90.length; i++) {
    player1.push(balls90[i]);

    document.writeln('<div id='+div_id[i]+' draggable=true droppable=true     
ondragstart=drag(event)>'+balls90[i]+'</div>');
  }
}

getNumbers();


function dragWord(dragEvent){
dragEvent.dataTransfer.setData("text/html",     
dragEvent.target.textContent+"|"+dragEvent.target.parentNode.id);
}


function dropWord(dropEvent){
var dropData = dropEvent.dataTransfer.getData("text/html");
var dropItems = dropData.split("|");
var prevElem = document.getElementById(dropItems[1]);
prevElem.getElementsByTagName("div")[0].textContent = dropEvent.target.textContent;
dropEvent.target.textContent = dropItems[0];
dropEvent.preventDefault();
}

function allowDrop(ev) {
ev.preventDefault();
}  


function drag(ev) {
    ev.dataTransfer.setData("Text", ev.target.id);
}

function drop(ev) {
    ev.preventDefault();
    var data = ev.dataTransfer.getData("Text");
    ev.target.appendChild(document.getElementById(data));
var match = 0;
//if(){//if 4 boxes are not empty

 var result = true;
 for (var i=0; i<original.length; ++i) {
 if (original[i] !== $("#box"+(i+1)).text()) {
 result = false;
 break;
}
}

if(result) {
alert("correct");

} 
}

</script>
<center><button onclick='next()'>NEXT</button></center>
<div id="result"></div>

</body>
</html>
user3773928
  • 53
  • 1
  • 6