So i just found out how to use ajax to POST to a PHP file. What i'm trying to do is POST a name and cause of death to a PHP script which will then use Mysql to add users to a database. However when i press the submit button and run the script (that i have somewhere else in the page and it works fine) It turns my screen white, and nothing is added to the DB.
The page is hosted at http://rhoiyds.com/deathnote/index.php Try it out for yourself. Use the arrow keys to scroll to the last page of the book to add something. Also i use the same kind of script in the search feature and it works, yet the adding feature doesnt. Please help? I have my suspicions about this line of code:
xmlhttp.send("name="+document.getElementById("nameadd").value+"&cod="+document.getElementById("codadd").value);
Should i have that second + symbol and should the & be inside the quote marks? Still i wouldn't think that would send the screen blank...
EDIT: Adding code:
<script>
function loadXMLDoc()
{
var xmlhttp;
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("result").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("POST","check.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("name="+document.getElementById("name").value);
}
</script>
<script>
function write()
{
var xmlhttp;
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("result").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("POST","write.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("name="+document.getElementById("nameadd").value+"&cod="+document.getElementById("codadd").value);
}
</script>
</head>
The top script is for the writing to database The bottom script it for checking for names in the DB
The following is the form (that isn't actually a form) that the user inputs to.
<div class="content"><div class="name">Name: <br/> Cause Of Death: </div>
<div class="cod"><textarea type="text" name="nameadd" id="nameadd" maxlength="25"
placeholder="Input Name" required>
</textarea> <br /> <textarea type="text" name="cod" id="codadd" maxlength="130" rows="4" placeholder="Cause of Death" required>
</textarea> <br />
<button type="button" onclick="write()" return false>Submit</button></div></div>';
PHP script for checking names
/* create a prepared statement */ if ($stmt = mysqli_prepare($link, "SELECT cod FROM deathnote WHERE victim=?")) {
/* bind parameters for markers */
mysqli_stmt_bind_param($stmt, "s", $_POST['name']);
/* execute query */
mysqli_stmt_execute($stmt);
/* bind result variables */
mysqli_stmt_bind_result($stmt, $cod);
/* fetch value */
mysqli_stmt_fetch($stmt);
if ($cod=="") { $cod= $_POST['name'] . " is not in the deathnote."; }
echo $cod;
/* close statement */
mysqli_stmt_close($stmt); }
/* close connection */ mysqli_close($link);
PHP SCRIPT FOR ADDING NAMES
$sql="INSERT INTO deathnote (victim, cod)
VALUES
('$_POST[name]','$_POST[cod]')";
if (!mysqli_query($con,$sql))
{
die('Error: ' . mysqli_error($con));
}
mysqli_close($con);
echo "success";
The problem wasn't with my AJAX function, the problem was that someone had SQL injected my database with a CSS rule. :(
You need to stop the form from actually being submitted. The easiest fix would be to change this:
<button type="button" onclick="loadXMLDoc()">Submit</button>
to this:
<button type="button" onclick="loadXMLDoc(); return false">Submit</button>
There may be other problems, but try that first