JavaScript, както е дефиниран във вашия въпрос, не може да работи директно с MySql. Това е така, защото не работи на същия компютър.
JavaScript работи от страна на клиента (в браузъра), а базите данни обикновено съществуват от страна на сървъра. Вероятно ще трябва да използвате междинен език от страна на сървъра (като PHP, Java, .Net или JavaScript стек от страна на сървъра като Node.js), за да изпълните заявката.
Ето урок за това как да напишете някакъв код, който да свързва PHP, JavaScript и MySql заедно, като кодът се изпълнява както в браузъра, така и на сървър:
http://www.w3schools.com/php/php_ajax_database.asp
А ето и кода от тази страница. Не съвпада точно с вашия сценарий (извършва заявка и не съхранява данни в DB), но може да ви помогне да започнете да разбирате видовете взаимодействия, които ще ви трябват, за да накарате това да работи.
По-специално, обърнете внимание на тези битове код от тази статия.
Части от Javascript:
xmlhttp.open("GET","getuser.php?q="+str,true);
xmlhttp.send();
Битове от PHP код:
mysql_select_db("ajax_demo", $con);
$result = mysql_query($sql);
// ...
$row = mysql_fetch_array($result)
mysql_close($con);
Освен това, след като разберете как работи този вид код, предлагам ви да използвате библиотеката на jQuery JavaScript, за да извършвате вашите AJAX повиквания . Той е много по-чист и по-лесен за работа от вградената поддръжка на AJAX и няма да ви се налага да пишете код, специфичен за браузъра, тъй като jQuery има вградена поддръжка за различни браузъри. Ето страницата за документацията на jQuery AJAX API .
Кодът от статията
HTML/Javascript код:
<html>
<head>
<script type="text/javascript">
function showUser(str)
{
if (str=="")
{
document.getElementById("txtHint").innerHTML="";
return;
}
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","getuser.php?q="+str,true);
xmlhttp.send();
}
</script>
</head>
<body>
<form>
<select name="users" onchange="showUser(this.value)">
<option value="">Select a person:</option>
<option value="1">Peter Griffin</option>
<option value="2">Lois Griffin</option>
<option value="3">Glenn Quagmire</option>
<option value="4">Joseph Swanson</option>
</select>
</form>
<br />
<div id="txtHint"><b>Person info will be listed here.</b></div>
</body>
</html>
PHP код:
<?php
$q=$_GET["q"];
$con = mysql_connect('localhost', 'peter', 'abc123');
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("ajax_demo", $con);
$sql="SELECT * FROM user WHERE id = '".$q."'";
$result = mysql_query($sql);
echo "<table border='1'>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
<th>Hometown</th>
<th>Job</th>
</tr>";
while($row = mysql_fetch_array($result))
{
echo "<tr>";
echo "<td>" . $row['FirstName'] . "</td>";
echo "<td>" . $row['LastName'] . "</td>";
echo "<td>" . $row['Age'] . "</td>";
echo "<td>" . $row['Hometown'] . "</td>";
echo "<td>" . $row['Job'] . "</td>";
echo "</tr>";
}
echo "</table>";
mysql_close($con);
?>