Trying to get info from a database based on a click event and load the data into variables to be used later in the form. This is part of the code. A connection to reps table has been made using PDO::
function fill_contact(evt) //display click event
{
var country_id = evt.target.id
document.getElementById('country_name').firstChild.data = country_id
<?php
$country = $_GET['country_name'];
try {
// Establish server connection and select database
$dbh = new PDO("mysql:host=$host;dbname=$database", $user, $password);
$dbh->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
} catch(PDOException $e){
die("Sorry, we could not connect you to this database, please contact the Administrator to sort this out.". $e->getMessage());/** try open contact form here**/
}
/** run prepare to select records **/
$stmt = $dbh->prepare("SELECT firstname, lastname, email, photo FROM reps WHERE country = :country");
$stmt->bindParam(':country', $country, PDO::PARAM_STR);
$stmt->execute();
?>
<script language="javascript" type="text/javascript">
function fill_contact(evt) //display click event
{
var country_id = evt.target.id
document.getElementById('country_name').firstChild.data = country_id
/* need to get a ajax http fetch statement here???*/
}
function getDataFile(mapString , useData)
{
/** call getURL() if available **/
if (window.getURL) {
getURL(mapString , useData);
}
else
/** call XMLHttpRequest() if available **/
if (window.XMLHttpRequest)
{
function XMLHttpRequestCallback()
{
if (xmlRequest.readyState == 4) { useData({success:xmlRequest.status,content:xmlRequest.responseText,contentType:xmlRequest.getResponseHeader("Content-Type")})
}
}
var xmlRequest = null;
xmlRequest = new XMLHttpRequest();
xmlRequest.open("GET",mapString,true);
xmlRequest.onreadystatechange = XMLHttpRequestCallback;
xmlRequest.send(null);
}
/** write an error message if either method is not available **/
else {
alert("your browser/svg viewer neither supports window.getURL nor window.XMLHttpRequest!");
}
}
</script>
<body>
<div id="IndexPage_Left_top">
<h1>Country: <span class="label" id="country_name"> </span> </h1>
<table >
<tbody>
<tr>
<td><h4>Regional Representative: </h4></td>
<td><h4><span class="label" id="firstname">$firtname</span> <span class="label" id="lastname">$lastname</span></h4></td><!--get Rep name from database based on country from svg to display-->
</tr>
<tr></tr>
<tr height="300px" align="top">
<td ><h4> Photo:</h4></td><!--get Rep photo from database based on country from svg to display-->
<td><span class="photo" id="photo"></td>
</tr>
<tr>
<td></td>
<td><input style='margin-top: 20px;' type="submit" value="Contact me" id='jqxButton' /></td>
</tr><!-- if clicked, it opens a contact form below, the email address is hidden-->
</tbody>
</table>
</div>
<div id="IndexPage_Left_bottom">
<h4>email form here<h4>
<p> email address is <span class="label" id="email">$email</span> </p><!-- if email is clicked, it opens a contact form here with email address from above -->
</div>
</div>
<div id="IndexPage_Right">
<svg id="map" version="1.1" rest of svg code
This goes with my other question about svg. (displaying data from sql from clicking on svg map) Once i click on a svg, it populates variables used to display data about country clicked. The variables are also used to populate a contact form.
It does not want to populate the table?
