CodingForums.com

CodingForums.com (http://www.codingforums.com/index.php)
-   Ajax and Design (http://www.codingforums.com/forumdisplay.php?f=55)
-   -   Something odd with the code... (http://www.codingforums.com/showthread.php?t=249269)

Morro1980 01-19-2012 07:25 PM

Something odd with the code...
 
I have two files
One is myprofile.php that makes an AJAX operation with a php script on the server - handleAjax.php

When executing the myprofile.php it seems to be everything ok until trying to edit a row.
It's supposed to change the "edit" button to "save" and it's properties so that the new "save" button will onclick execute the ajaxUpdate() function, which supposed to send a data to the server, where it handled by handleAJAX.php
Instead of it when pressing the "edit" button it changes the button to "save" and without any additional click executes the ajaxUpdate(). In addition it, the data is not sent to the server correctly (it appears that $_POST['columnName'], $_POST['email'] and $_POST['updatedText'] are undefined).

I have spent a couple of hours trying to understand where is the problems, but without a success.
Please help.
Thank you in advance.

Code:

<?php
session_start();
include 'funcs.php';
include 'paramslist.php'
?>
<html>
<head><title>My profile</title>
<script type="text/javascript">
function ajaxEditRow(rowName,email){
    var prevText = document.getElementById(rowName).innerHTML;
    document.getElementById(rowName).innerHTML = "<input type='text' id='"+rowName+"' value='"+prevText+"' />";
    var rowName1 = rowName+"1";
    document.getElementById(rowName1).innerHTML = "";
    document.getElementById(rowName1).innerHTML = "<button type='button' onclick='ajaxUpdate(\""+email+"\",\""+rowName+"\")'>save</button>";
}
function ajaxUpdate(userEmail, rowName){
  document.getElementById('test1').innerHTML = "started ajax update with params:";
  document.getElementById('test2').innerHTML = "userEmail="+userEmail+" rowName="+rowName;
  var updatedText = document.getElementById(rowName).innerHTML;
  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(rowName).innerHTML="";
      document.getElementById(rowName).innerHTML=xmlhttp.responseText+"<label id='"+rowName+"1"+"'><button type='button' name='editRow' value='edit' onclick='ajaxEditRow("+"\""+rowName+"\""+")'>edit</button></label><br />";
    }
  }
  var params = "updatedText="+updatedText+"&email="+userEmail+"&columnName="+rowName;
  xmlhttp.open("POST","handleAjax.php",true);
  xmlhttp.setRequestHeader("Content-length", params.length);
  xmlhttp.send(params);
}
function vasya(){
    document.getElementById('test3').innerHTML = "Vasya started";
}
</script>
</head>
<body>
<?php
/*To Do
Retrive and show the page of the user */
if (array_key_exists('Email', $_SESSION))
{
  foreach ($paramsList as $key => $value)
  {
    if (trimspaces($key) != "Password")
    {
      if (trimspaces($key) != "Email")
      {
        echo $key.": <label id='".trimSpaces($key)."'>".$_SESSION[trimSpaces($key)]."</label>
        <label id='".trimSpaces($key)."1"."'><button type='button' name='editRow' value='edit'
        onclick='ajaxEditRow("."\"".trimSpaces($key)."\",\"".$_SESSION['Email']."\"".")'>edit</button></label><br />";
      }
      else{
        echo $key.": ".$_SESSION[trimSpaces($key)]."<br />";
      }
    }
  }
?>

<?php
}
else
{
  echo "You are not logged in. Please go back and log in.";
}
?>
<label id='test1' ></label>
<label id='test2'></label>
<label id='test3'></label>
</body>
</html>

handleAjax.php

PHP Code:

<?php 
$email 
$_POST['email']; 
$updatedText $_POST['updatedText']; 
$columnName $_POST['columnName']; 
$con mysql_connect("localhost","root","XXX"); 
if (!
$con

  echo 
"Couldn't connect...."
  die(
'Could not connect: ' mysql_error()); 

mysql_select_db("XXX"$con); 
mysql_query("UPDATE Members SET ".$columnName."='".$updatedText."' WHERE Email = '".$email."'"); 
$data=mysql_query("SELECT '".$columnName."' FROM Members WHERE Email='".$email."'"); 
$info mysql_fetch_array($data); 
mysql_close($con); 
foreach (
$info as $key => $value
    echo 
$value

?>


devnull69 01-20-2012 07:38 AM

Can you please show the resulting HTML of myprofile.php? It will help in understanding what's going on

On a first glimpse I only noticed that you forgot two things for the Ajax request
1. Use encodeURIComponent() on every parameter value to make it URI compliant
2. set a correct request header for a POST request
Code:

  var params = "updatedText="+encodeURIComponent(updatedText)+"&email="+encodeURIComponent(userEmail)+"&columnName="+encodeURIComponent(rowName);
  xmlhttp.open("POST","handleAjax.php",true);
  xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  xmlhttp.send(params);


Morro1980 01-22-2012 09:36 AM

Thank you very much
I have repaired my code and now it works just fine)


All times are GMT +1. The time now is 03:52 PM.

Powered by vBulletin®
Copyright ©2000 - 2013, Jelsoft Enterprises Ltd.