...

View Full Version : AJAX PHP Problem



snowysweb
01-07-2009, 05:50 AM
THIS PAGE HERE (http://81.106.168.84/instantedit/)

Morning, going to chop my head off if i dont get my head around this soon.
Found this lil script on the net the other day it was called quick edit, there was no need to refresh page or press a submit button for it to upload. Could Anyone tell me why itt isnt working.


#index.php

<?php
include("database_connect.php");
?>

<html>
<head>
<title>Flick-Like Editing Test</title>

<style>
input.editMode {
background-color : #FFFF99;
}
textarea.editMode {
background-color : #FFFF99;
}
.savingAjaxWithBackground {
background-color : #FFFF99;
}
.superBigSize {
font-size: 45px;
font-weight: bold;
}
td.underlinedTD {
border-bottom:1px #000000 dashed;
}
table.infoBox {
background-color:#F6F6F6;
border:#999999 double 1px;
font-size:11px;
padding:2px;
}
</style>

<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', action);
http.onreadystatechange = handleResponse;
http.send(null);
}

function handleResponse() {
if(http.readyState == 4){
if(http.responseText=="name") {
var replaceText = document.getElementById('person_name').value;
document.getElementById('name_rg_display_section').innerHTML = replaceText;
document.getElementById('name_rg').style.display = '';
document.getElementById('name_hv').style.display = 'none';
}
else if(http.responseText=="email") {
var replaceText = document.getElementById('email_value').value;
document.getElementById('email_rg_display_section').innerHTML = "<b>Email:</b> " + replaceText;
document.getElementById('email_rg').style.display = '';
document.getElementById('email_hv').style.display = 'none';
}
else if(http.responseText=="phone") {
var replaceText = document.getElementById('phone_value').value;
document.getElementById('phone_rg_display_section').innerHTML = "<b>Phone:</b> " + replaceText;
document.getElementById('phone_rg').style.display = '';
document.getElementById('phone_hv').style.display = 'none';
}
}
}
function flashRow(obj) {
obj.bgColor = "#FFFF99";
}
function unFlashRow(obj) {
obj.bgColor = "#F6F6F6";
}
</script>
</head>
<body>



<table cellpadding="3" cellspacing="2" class="infoBox">
<tr><td align="right" class="underlinedTD"><b>Contact</b></td></tr>
<tr><td></td></tr>
<?php
if($editingMyOwn ==1) { ?>
<tr id="name_rg">
<td onMouseOver="flashRow(this);" onMouseOut="unFlashRow(this);" onClick="

document.getElementById('name_hv_editing_section').style.display = '';
document.getElementById('name_hv_saving_section').style.display = 'none';
document.getElementById('name_rg').style.display = 'none';
document.getElementById('name_hv').style.display = '';


">
<div class="superBigSize" id="name_rg_display_section">
<?php echo $firstName . " " . $lastName; ?>
</div></td></tr>
<tr id="name_hv"><td>
<div id="name_hv_editing_section">
<input type="text" class="superBigSize editMode" size="<?php $val=strlen($firstName)+strlen($lastName); echo $val; ?>" value="<?php echo $firstName . " " . $lastName; ?>" id="person_name" /> <br /><input type="button" value="Save" onClick="document.getElementById('name_hv_editing_section').style.display='none';document.getElementById('nam e_hv_saving_section').style.display='';var req = 'updateProfileAjax.php?part=name&val=' + document.getElementById('person_name').value;sndReq(req);" /> Or <input type="button" value="Cancel" onClick="
document.getElementById('name_rg').style.display = '';
document.getElementById('name_hv').style.display = 'none';
"/>

</div>
<span id="name_hv_saving_section" class="savingAjaxWithBackground">
Saving...
</span>
<script type="text/javascript">
document.getElementById('name_hv').style.display = 'none';
document.getElementById('name_hv_saving_section').style.display = 'none';
</script>
</td></tr>
<?php }
else { ?>
<tr>
<td>
<div class="superBigSize"><?php echo $firstName . " " . $lastName; ?></div>
</td></tr>
<?php } ?>









<!--<tr><td align="right" class="underlinedTD">Email</td></tr>-->




<?php
if($editingMyOwn ==1) { ?>
<tr id="email_rg">
<td onMouseOver="flashRow(this);" onMouseOut="unFlashRow(this);" onClick="
document.getElementById('email_hv_editing_section').style.display = '';
document.getElementById('email_hv_saving_section').style.display = 'none';
document.getElementById('email_rg').style.display = 'none';
document.getElementById('email_hv').style.display = '';

">
<div class="" id="email_rg_display_section"><b>Email:</b> <?php echo $email; ?></div>
</td></tr>

<tr id="email_hv"><td>
<div id="email_hv_editing_section"><b>Email:</b>
<input type="text" class=" editMode" size="<?php $val=strlen($email); echo $val; ?>" value="<?php echo $email; ?>" id="email_value" /> <br /><input type="button" value="Save" onClick="document.getElementById('email_hv_editing_section').style.display='none';document.getElementById('em ail_hv_saving_section').style.display='';var req = 'updateProfileAjax.php?part=email&val=' + document.getElementById('email_value').value;sndReq(req);" /> Or <input type="button" value="Cancel" onClick="document.getElementById('email_rg').style.display = '';
document.getElementById('email_hv').style.display = 'none';"/>

</div>
<span id="email_hv_saving_section" class="savingAjaxWithBackground">
Saving...
</span>
<script type="text/javascript">
document.getElementById('email_hv').style.display = 'none';
document.getElementById('email_hv_saving_section').style.display = 'none';
</script>
</td></tr>
<?php }
else { ?>
<tr>
<td>
<div class=""><b>Email:</b> <?php echo $email; ?></div>
</td>
</tr>
<?php } ?>






<?php
if($editingMyOwn ==1) { ?>
<tr id="phone_rg">
<td onMouseOver="flashRow(this);" onMouseOut="unFlashRow(this);" onClick="
document.getElementById('phone_hv_editing_section').style.display = '';
document.getElementById('phone_hv_saving_section').style.display = 'none';
document.getElementById('phone_rg').style.display = 'none';
document.getElementById('phone_hv').style.display = '';

">
<div id="phone_rg_display_section"><b>Phone:</b> <?php echo $phone; ?></div>
</td></tr>


<tr id="phone_hv"><td>
<div id="phone_hv_editing_section"><b>Phone:</b>
<input type="text" class=" editMode" size="<?php $val=strlen($phone); echo $val; ?>" value="<?php echo $phone; ?>" id="phone_value" /> <br /><input type="button" value="Save" onClick="document.getElementById('phone_hv_editing_section').style.display='none';document.getElementById('ph one_hv_saving_section').style.display='';var req = 'updateProfileAjax.php?part=phone&val=' + document.getElementById('phone_value').value;sndReq(req);" /> Or <input type="button" value="Cancel" onClick="document.getElementById('phone_rg').style.display = '';
document.getElementById('phone_hv').style.display = 'none';"/>

</div>
<span id="phone_hv_saving_section" class="savingAjaxWithBackground">
Saving...
</span>
<script type="text/javascript">
document.getElementById('phone_hv').style.display = 'none';
document.getElementById('phone_hv_saving_section').style.display = 'none';
</script>
</td></tr>
<?php }
else { ?>
<tr>
<td>
<div class=""><b>Phone:</b> <?php echo $phone; ?></div>
</td>
</tr>
<?php } ?>


</table>
</body>
#updateProfileAjax.php

<?php

include("database_connect.php");

if($loggedIn == 1) {

$part = mysql_escape_string($_GET['part']);

$val = mysql_escape_string($_GET['val']);

$id = $userId;


if($part == "name") {
$array = split(" ",$val);
$firstName = mysql_escape_string($array[0]);
$lastName = mysql_escape_string($array[1]);
$sql = "UPDATE `$table` SET firstname = '$firstName', lastname = '$lastName' WHERE id=$id";
}
else if($part == "email") {
$sql = "UPDATE `$table` SET email = '$val' WHERE id=$id";
}
else if($part == "desc") {
$sql = "UPDATE `$table` SET description = '$val' WHERE id=$id";
}
else if($part == "phone") {
$sql = "UPDATE `$table` SET phone = '$val' WHERE id=$id";
}
mysql_query($sql);

mysql_close();
echo $part;

echo $_GET['part'];
}



?>
#database_connect.php

<?php

$sql_username = "root";
$sql_password = "";
$sql_server = "localhost"; //useualy localhost
$sql_database = "blogs";

$table = "demo";

$con = mysql_connect ($sql_server, $sql_username, $sql_password);

mysql_select_db($sql_database, $con);

$query = mysql_query("SELECT * from `$table` where id='1'");
$array = mysql_fetch_array($query);

$editingMyOwn = $array["user_level"];
$firstName = $array["firstname"];
$lastName = $array["lastname"];
$email = $array["email"];
$phone = $array["phone"];


?>

Fou-Lu
01-07-2009, 05:59 AM
Java != Javascript.
Moving to AJAX forum.

snowysweb
01-07-2009, 06:05 AM
sorry didnt see the AJAX section!

ohgod
01-07-2009, 01:29 PM
the easiest first step towards finding where it is broken is to get a tool like firebug for firefox to monitor the ajax transaction. then you can watch it to see if it's even getting out the door or getting hung in the backend somewhere.

point being, how far is it making it? just saying it is broken isn't that useful. can you describe its behavior?



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum