I create a javascript + a php page. The script on the php page send data to my sql database, but don't show the result into on my home page.
Here the code
function getVote(question_ID) {
var option_ID = document.querySelector("input[id='option']:checked").value;
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 (option_ID.readyState == 4 && option_ID.status == 200) {
document.getElementById(poll).innerHTML = option_ID.responseText;
}
}
xmlhttp.open("GET", "./core/vote.php?user_ID=" + user_ID + "&question_ID=" + question_ID + "&option_ID=" + option_ID, true);
xmlhttp.send();
}
<div id="poll">
</div>
More code
<div id="poll">
<form method="post" onsubmit='getVote(question_ID);' >
<p><?php echo $question ['question_content']; ?></p>
<p>
<?php
$poll_option_selection = "SELECT option_ID, option_content FROM poll_options WHERE question_ID='$question_ID'" ;
$poll_option_result = mysqli_query ($connect,$poll_option_selection) ;
foreach ($poll_option_result as $poll_option) {
$option_ID = $poll_option ['option_ID'] ;
$option_content = $poll_option ['option_content'] ;
?>
<script type="text/javascript">
var option_ID = <?php echo json_encode($option_ID) ; ?> ;
</script>
<input type="radio" id="option" value ='<?php echo $option_ID ?>' required />
<?php echo $option_content ?>
</br>
<?php
}
?>
<input type="submit">
</form>
</div>
Thank you for your help
It should be:
document.getElementById("poll").innerHTML=option_ID.responseText;
document.getElementById takes the argument (id of element) as a string.
Related
I'm kind fresh with Ajax and done some examples they worked, but then they stopped, I believe somewhere is error involved.
mainfile
<button class='chbt' title='Test' value=" . $i . " onclick='changer($(this).val())'></button>
changer function
function changer(val)
{
if (val == null)
{
document.getElementById("dataedit").innerHTML = "";
return;
}
else
{
if (window.XMLHttpRequest)
{
xmlhttp = new XMLHttpRequest();
}
else
{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function()
{
if (this.readyState == 4 && this.status == 200)
{
document.getElementById("dataedit").innerHTML = this.responseText;
}
};
xmlhttp.open("GET","testing.php?id="+val,true);
xmlhttp.send();
}
testing.php file
<?php
include_once 'dbconnect.php';
$ged = $_GET['id'];
$query = $DBcon->query("SELECT * FROM review WHERE RID=".$ged);
$RRow=$query->fetch_array();
?>
<html>
<head>
<script src="scripts/jscript.js"></script>
</head>
<body>
<script>
alert("working123!!!");
$('#dataformas').hide();
$('#dataedit').show();
</script>
<form method='post' action='updatereview.php' id='updata' name='updata'>
Vn<input name='rating' id='rating' type='range' min='1' max='5' maxlength='500' value='<?php echo $RRow[4]; ?>' step='1' required />Pt<br><br>
<textarea name='edittext' id='edittext' rows='5' cols='30'><?php echo $RRow[2]; ?></textarea>
<span id='count2'></span>
<script>
//location.hash = ".updata";
var el_t = document.getElementById('edittext');
var length = el_t.getAttribute('maxlength');
var el_c = document.getElementById('count2');
el_c.innerHTML = length;
el_t.onkeyup = function ()
{
document.getElementById('count2').innerHTML = (length - this.value.length)+' left';
};
</script><br>
<input type='hidden' name='idas' id='idas' value="<?php echo $ged; ?>">
<input type='hidden' name='cidas' id='cidas' value="<?php echo $RRow[3]; ?>">
<button type='submit' form='updata' id='send_button' value='Submit'>Update</button>
</form>
</body>
</html>
I as you can see I need to pass one param which is integer generated by loop, so my changer function is not working and throws
Uncaught TypeError: Cannot set property 'innerHTML' of null
at XMLHttpRequest.xmlhttp.onreadystatechange
I have a problem with my ajax php coding.
The problem is when the user enter their password to login ,the live checking function output only shown blank in select box below, not the data from database.
Below is my code:
Login.php
username:<input type="text" class="name" id="uname" placeholder="enter your username here"><br>
password:<input type="password" class="pass" id="pword" placeholder="password here"><br>
<div id="txt">
responsibility:<select id="opti">
<option value=""> Select your responsibility</option>
</select><br></div>
<script>
function showUser(str) {
if (str == "") {
document.getElementById("txt").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("txt").innerHTML = this.responseText;
}
};
xmlhttp.open("POST","dblogin.php?q="+str,true);
xmlhttp.send();
}
}
document.getElementById('pword').addEventListener("keyup", function(str) {
showUser(str);
}, false);
</script>
Dblogin.php
<?
$q=intval($_POST["pword"]);
require ("config.php");
$link=mysqli_connect($host,$user,$pass,$db);
$query="select responsibility from testing where password = '".$q."'";
$result=mysqli_query($link,$query);
if($result){
?>
<form>
responsibility:<select id="opti">
<?
while($row=mysqli_fetch_array($result))
echo"<option value='$row[1]'>$row[1]</option>";
?>
</select>
<input type=submit value ="submit">
<?
}
else
{
?>
Error:No Data Found
<?
}
?>
config.php
<?
$host="localhost";
$db="logindb"
$user="root"
$pass="";
?>
the ajax function is work, but the database data not shown. Can anybody tell me what wrong with my coding.
I display a table on the website after a select option (I use ajax) and get the datas from the database. What I want to do is to insert a checkbox in my table and when it is checked delete the row in the database. I don't want to use a submit button but only the checkbox to delete it.
I'm not really good with ajax and JavaScript. This is the code:
The select :
<p>
<label for="client">Veuillez choisir le fournisseur :</label><br />
<select name="client" id="client" onchange="showUser(this.value)">
<?php
// echo '<option value=""/></option>';
while ($donnees = $reponse->fetch())
{
echo '<option value='.$donnees['refCustomer'].'>'.$donnees['legalCompanyName'].' </option>';
//$value = $donnees['refCustomer'];
}
$reponse->closeCursor();
?>
</select>
</p>
The script :
<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","getTableBuffer.php?q="+str,true);
xmlhttp.send();
}
}
</script>
getTableBuffer.php :
<?php
$q = intval($_GET['q']);
try
{
$bdd = new PDO());
}
catch (Exception $e)
{
die('Erreur : ' . $e->getMessage());
}
$reponse = $bdd->query('select * from vendor_'.$q.'_offers_ncli_amendments_buffer');
echo '<table class="imagetable">';
echo '<tr>';
echo '<th>code</th>';
echo '<th>dateAdded</th>';
echo '<th>effectiveDate</th>';
echo '<th>price</th>';
echo '<th>type</th>';
echo '<th>destination</th>';
echo '</tr>';
while ($donnees = $reponse->fetch())
{
echo '<tr>';
echo '<td><input type="checkbox" name="code" id="code" value="'.$donnees['code'].'"/>'.$donnees['code'].'</td>';
echo '<td>'.$donnees['dateAdded'].'</td>';
echo '<td>'.$donnees['effectiveDate'].'</td>';
echo '<td>'.$donnees['price'].'</td>';
echo '<td>'.$donnees['type'].'</td>';
echo '<td>'.$donnees['destination'].'</td>';
echo "</tr>";
}
echo "</table>";
echo "</br>";
echo "</br>";
$reponse->closeCursor();
?>
Add event onclick to your checkbox :
echo '<td><input onclick="remove(this);" type="checkbox" name="code" id="code" ....';
create function remove() in you javascript, that send the $donnees['code'] to a remove.php to delete it from DB :
function remove(e)
{
if (e.target.checked)
{
....
xmlhttp.open("GET","remove.php?code="+e.target.value,true);
xmlhttp.send();
}
}
Create remove.php that get the code and delete from DB :
<?php
if(isset($_GET['code'])){
//Query to remove from DB where code = $_GET['code']
}
?>
Hope this will help.
I would like to display one column of data, [pin], based on the [plan] and [order_id] values. plan=9 and order_id=0. Would like to load data without reloading page, using ajax.
Here is my HTML/Script:
<script>
function showPins(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","getPins.php?q="+str,true);
xmlhttp.send();
}
}
</script>
HTML:
<div align="center">
<h3>View PIN's</h3>
<form>
<select name="users" onchange="showPins(this.value)">
<option value="">Select Plan Type:</option>
<option value="1">Plan1</option>
<option value="2">Plan2</option>
<option value="3">Plan3</option>
</select>
</form>
<br/>
<div id="txtHint"></div>
</div>
This is my PHP file (getPins.php):
<?php
$q = intval($_GET['q']);
$con = mysqli_connect('myHost','myUsername','myPw','my_db');
if (!$con) {
die('Could not connect: ' . mysqli_error($con));
}
mysqli_select_db($con,"my_db");
$sql="SELECT * FROM attPins WHERE (order_id=0, plan=9 and id = '".$q."')";
$result = mysqli_query($con,$sql);
echo "<table>
<tr>
<th>PIN's</th>
</tr>";
while($row = mysqli_fetch_array($result)) {
echo "<tr>";
echo "<td>" . $row['pin'] . "</td>";
echo "</tr>";
}
echo "</table>";
mysqli_close($con);
This is based off the tutorial shown here: http://www.w3schools.com/php/php_ajax_database.asp
Trying to make it work for showing the correct pins for plan type chosen.
your query would be wrong read manual where
$sql="SELECT * FROM attPins WHERE (order_id=0, plan=9 and id = '".$q."')";
It would be
WHERE (order_id=0 and plan=9 and id = '".$q."')
Or
WHERE (order_id=0 OR plan=9 and id = '".$q."')
according to your requirment
I have read quite a bit and I still am missing something.
I have a page that has a button on it. When you click the button it will call an AJAX function that will then wait and refresh every 5 seconds in waiting for a MySQL database change. Once the change in the database is made, I would like to take the user to a new page all together.
I have tested the refreshing for the database changes and they work great with echos. I have tried to use windows.location and the php header redirect. Neither are working.
I am not using jquery for the ajax call. Any help would be greatly appreciated.
Thank you
code:
index.php
<?php
session_start();
$_SESSION = array(
'player' => 0
);
?>
<!DOCTYPE HTML>
<html>
<head>
<script src="ajax.js"></script>
<title></title>
</head>
<body>
<div id="join"><button type="button" onclick="startGame()">Throwdown!</button></div>
</body>
</html>
rpsjoin.php
<?php
include("db.php");
session_start();
$lastId_q = mysqli_fetch_assoc(mysqli_query($con,'SELECT MAX(id) AS id from game'));
$lastId = $lastId_q['id'];
$gameStatus_q = mysqli_fetch_assoc(mysqli_query($con,'SELECT game.game_status FROM game WHERE game.id =' . $lastId));
$gameStatus = $gameStatus_q['game_status'];
if ($gameStatus == 2) {
mysqli_query($con, "INSERT INTO game (game_status, player1_joined) VALUES(1,1)");
$_SESSION['player'] = '1';
$playerNumber = $_SESSION['player'];
$lastId_q = mysqli_fetch_assoc(mysqli_query($con,'SELECT MAX(id) AS id from game'));
$lastId = $lastId_q['id'];
$_SESSION['lastId'] = $lastId;
} elseif ($gameStatus == 1 && $_SESSION['player'] != 1) {
mysqli_query($con, "UPDATE game SET player2_joined = 1 WHERE id = " . $lastId);
$_SESSION['player'] = '2';
$playerNumber = $_SESSION['player'];
$_SESSION['lastId'] = $lastId;
}
$player1_join_q = mysqli_fetch_assoc(mysqli_query($con,'SELECT player1_joined FROM game WHERE game.id =' . $lastId));
$player2_join_q = mysqli_fetch_assoc(mysqli_query($con,'SELECT player2_joined FROM game WHERE game.id =' . $lastId));
$player1_join = $player1_join_q['player1_joined'];
$player2_join = $player2_join_q['player2_joined'];
echo $lastId . "<BR>";
echo $gameStatus . "<BR>";
echo $player1_join . "<BR>";
echo $player2_join . "<BR>";
if ($player1_join == 1 && $player1_join == $player2_join) {
echo '<form action="rpsover.php" method="post">
<button type="submit" name="player" value="1">Rock</button>
<button type="submit" name="player" value="2">Paper</button>
<button type="submit" name="player" value="3">Scissors</button>
</form>';
} else {
echo "Locating player. Please be patient";
}
echo session_id();
?>
function startGame() {
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("join").innerHTML=xmlhttp.responseText;
setTimeout('startGame()',1000);
}
}
xmlhttp.open("GET","rpsjoin.php",true);
xmlhttp.send();
}
At the end of rpsjoin.php, instead of showing a form, i want to be redirected to another page.
Yes I know my code is bad and there are test echos in it.
Thank you