eri
09-08-2008, 10:59 AM
I am working on a phone book that uses AJAX and Perl. When the name is searched for, it should display the name, address, phone number, e-mail and an image. Everything works fine except for the image part. HTML and Perl code is below. Could someone please correct my code or let me know why the image does not get displayed while everything else does.:confused:
Also, this is my first time posting here... Please let me know if I have posted under the wrong forum.
Thanks.
-------------------------------------------------------------------------
HTML code
-------------------------------------------------------------------------
<html>
<head>
<script type="text/javascript">
function createRequestObject() {
var ro
var browser = navigator.appName
if(browser == "Microsoft Internet Explorer"){
ro = new ActiveXObject("Microsoft.XMLHTTP")
}else{
ro = new XMLHttpRequest()
}
return ro
}
var http = createRequestObject()
function sndReq(action) {
http.open('get', 'cgi/store.pl?searchInput='+action, true)
http.onreadystatechange = handleResponse
http.send(null)
}
function handleResponse() {
if(http.readyState == 4){
var response = http.responseText;
var update = new Array()
if(response.indexOf('|')) {
display = response.split('|')
document.getElementById('name').innerHTML = document.getElementById('input').value
document.getElementById('address').innerHTML = display[0]
document.getElementById('phone').innerHTML = display[1]
document.getElementById('email').innerHTML = display[2]
document.getElementById('image').src= display[3]
}
}
}
</script>
</head>
<body>
<form id="search">
<input type="text" id="input">
<input type="button" value="Search" onClick="sndReq(document.getElementById('input').value)">
</form>
<div id="name"></div>
<div id="address"></div>
<div id="phone"></div>
<div id="email"></div>
<img id="image" style="display:none" onload="style.display = 'block'"/>
</body>
</html>
-------------------------------------------------------------------------
External Perl Script (store.pl)
-------------------------------------------------------------------------
#!/usr/bin/perl
print "Content-type: text/html\n\n";
%query = split(/=/, $ENV{QUERY_STRING});
$searchEntry = $query{"searchInput"};
%addressdb = ('abc' => 'Address',
'xyz' => 'Address');
%phonedb = ('abc' => 'Phone Number',
'xyz' => 'Phone Number');
%emaildb = ('abc' => 'E-mail',
'xyz' => 'E-mail');
%imagedb = ('abc' => '<img src="http://domainname.com/image1.jpg" />',
'xyz' => '<img src="http://domainname.com/image2.jpg" />');
$address = $addressdb{"$searchEntry"};
$phone = $phonedb{"$searchEntry"};
$email = $emaildb{"$searchEntry"};
$email = $emaildb{"$searchEntry"};
$image = $imagedb{"$searchEntry"};
print "$address|$phone|$email|$image";
Also, this is my first time posting here... Please let me know if I have posted under the wrong forum.
Thanks.
-------------------------------------------------------------------------
HTML code
-------------------------------------------------------------------------
<html>
<head>
<script type="text/javascript">
function createRequestObject() {
var ro
var browser = navigator.appName
if(browser == "Microsoft Internet Explorer"){
ro = new ActiveXObject("Microsoft.XMLHTTP")
}else{
ro = new XMLHttpRequest()
}
return ro
}
var http = createRequestObject()
function sndReq(action) {
http.open('get', 'cgi/store.pl?searchInput='+action, true)
http.onreadystatechange = handleResponse
http.send(null)
}
function handleResponse() {
if(http.readyState == 4){
var response = http.responseText;
var update = new Array()
if(response.indexOf('|')) {
display = response.split('|')
document.getElementById('name').innerHTML = document.getElementById('input').value
document.getElementById('address').innerHTML = display[0]
document.getElementById('phone').innerHTML = display[1]
document.getElementById('email').innerHTML = display[2]
document.getElementById('image').src= display[3]
}
}
}
</script>
</head>
<body>
<form id="search">
<input type="text" id="input">
<input type="button" value="Search" onClick="sndReq(document.getElementById('input').value)">
</form>
<div id="name"></div>
<div id="address"></div>
<div id="phone"></div>
<div id="email"></div>
<img id="image" style="display:none" onload="style.display = 'block'"/>
</body>
</html>
-------------------------------------------------------------------------
External Perl Script (store.pl)
-------------------------------------------------------------------------
#!/usr/bin/perl
print "Content-type: text/html\n\n";
%query = split(/=/, $ENV{QUERY_STRING});
$searchEntry = $query{"searchInput"};
%addressdb = ('abc' => 'Address',
'xyz' => 'Address');
%phonedb = ('abc' => 'Phone Number',
'xyz' => 'Phone Number');
%emaildb = ('abc' => 'E-mail',
'xyz' => 'E-mail');
%imagedb = ('abc' => '<img src="http://domainname.com/image1.jpg" />',
'xyz' => '<img src="http://domainname.com/image2.jpg" />');
$address = $addressdb{"$searchEntry"};
$phone = $phonedb{"$searchEntry"};
$email = $emaildb{"$searchEntry"};
$email = $emaildb{"$searchEntry"};
$image = $imagedb{"$searchEntry"};
print "$address|$phone|$email|$image";