please help php/ajax

[richarro1234]

Hello all,

 

im having a bit of trouble with this peice of code:

<script language="javascript" type="text/javascript">
<!--
//Browser Support Code
function ajaxFunction(){

var ajaxRequest; // The variable that makes Ajax possible!

try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
} catch (e){
// Internet Explorer Browsers
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
// Something went wrong
alert("Your browser broke!");
return false;
}
}
}
// Create a function that will receive data sent from the server
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
var ajaxDisplay = document.getElementById('status');
ajaxDisplay.innerHTML = ajaxRequest.responseText;
}
}
var status = document.getElementById('mystatus').value;
var queryString = "?status=" + status;
ajaxRequest.open("GET", "status.php" + queryString, true);
ajaxRequest.send(null);
//alert(queryString);
}
//-->
</script>
<form>
<?= $r['name'] ?> <input id="mystatus" value="<?= $r['mystatus'] ?>" name="mystatus" size="30" style="color:#990000; font-weight:bold">  <input class="button" onClick="ajaxFunction();" value="Enter" type="button">
</form>
<div id='status'></div>
</td>
</tr>
<tr>
<td class="four">Select your mood:</td>
</tr>
<tr>
<td class="four">
<script language="javascript" type="text/javascript">
<!--
//Browser Support Code
function setmood(){

var ajaxRequest; // The variable that makes Ajax possible!

try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
} catch (e){
// Internet Explorer Browsers
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
// Something went wrong
alert("Your browser broke!");
return false;
}
}
}
// Create a function that will receive data sent from the server
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
var ajaxDisplay = document.getElementById('mood');
ajaxDisplay.innerHTML = ajaxRequest.responseText;
}
}
var status = document.getElementById('mymood').value;
var queryString = "?mood=" + mood;
ajaxRequest.open("GET", "mood.php" + queryString, true);
ajaxRequest.send(null);
alert(queryString);
}
//-->
</script>
<form>
<select id="mymood" onChange="setmood();">
<option value="Accepted">Accepted</option>
<option value="Accomplished">Accomplished</option>
<option value="Aggravated">Aggravated</option>
<option value="Alone">Alone</option>
<option value="Amused">Amused</option>
<option value="Angry">Angry</option>
<option value="Annoyed">Annoyed</option>
<option value="Anxious">Anxious</option>
<option value="Apathetic">Apathetic</option>
<option value="Ashamed">Ashamed</option>
<option value="Awake">Awake</option>
<option value="Bewildered">Bewildered</option>
<option value="Bitchy">Bitchy</option>
<option value="Bittersweet">Bittersweet</option>
<option value="Blah">Blah</option>
<option value="Blank">Blank</option>
<option value="Blissful">Blissful</option>
<option value="Bored">Bored</option>
<option value="Bouncy">Bouncy</option>
<option value="Calm">Calm</option>
<option value="Cheerful">Cheerful</option>
<option value="Chipper">Chipper</option>
<option value="Cold">Cold</option>
<option value="Complacent">Complacent</option>
<option value="Confused">Confused</option>
<option value="Content">Content</option>
<option value="Cranky">Cranky</option>
<option value="Crappy">Crappy</option>
<option value="Crazy">Crazy</option>
<option value="Crushed">Crushed</option>
<option value="Curious">Curious</option>
<option value="Cynical">Cynical</option>
<option value="Dark">Dark</option>
<option value="Depressed">Depressed</option>
<option value="Determined">Determined</option>
<option value="Devious">Devious</option>
<option value="Dirty">Dirty</option>
<option value="Disappointed">Disappointed</option>
<option value="Discontent">Discontent</option>
<option value="Ditzy">Ditzy</option>
<option value="Dorky">Dorky</option>
<option value="Drained">Drained</option>
<option value="Drunk">Drunk</option>
<option value="Ecstatic">Ecstatic</option>
<option value="Energetic">Energetic</option>
<option value="Enraged">Enraged</option>
<option value="Enthralled">Enthralled</option>
<option value="Envious">Envious</option>
<option value="Exanimate">Exanimate</option>
<option value="Excited">Excited</option>
<option value="Exhausted">Exhausted</option>
<option value="Flirty">Flirty</option>
<option value="Frustrated">Frustrated</option>
<option value="Full">Full</option>
<option value="Geeky">Geeky</option>
<option value="Giddy">Giddy</option>
<option value="Giggly">Giggly</option>
<option value="Gloomy">Gloomy</option>
<option value="Good">Good</option>
<option value="Grateful">Grateful</option>
<option value="Groggy">Groggy</option>
<option value="Grumpy">Grumpy</option>
<option value="Guilty">Guilty</option>
<option value="Happy">Happy</option>
<option value="High">High</option>
<option value="Hopeful">Hopeful</option>
<option value="Hot">Hot</option>
<option value="Hungry">Hungry</option>
<option value="Hyper">Hyper</option>
<option value="Impressed">Impressed</option>
<option value="Indescribable">Indescribable</option>
<option value="Indifferent">Indifferent</option>
<option value="Infuriated">Infuriated</option>
<option value="Irate">Irate</option>
<option value="Irritated">Irritated</option>
<option value="Jealous">Jealous</option>
<option value="Jubilant">Jubilant</option>
<option value="Lazy">Lazy</option>
<option value="Lethargic">Lethargic</option>
<option value="Listless">Listless</option>
<option value="Lonely">Lonely</option>
<option value="Loved">Loved</option>
<option value="Mad">Mad</option>
<option value="Melancholy">Melancholy</option>
<option value="Mellow">Mellow</option>
<option value="Mischievous">Mischievous</option>
<option value="Moody">Moody</option>
<option value="Morose">Morose</option>
<option value="Naughty">Naughty</option>
<option value="Nerdy">Nerdy</option>
<option value="Not Specified">Not Specified</option>
<option value="Numb">Numb</option>
<option value="Okay">Okay</option>
<option value="Optimistic">Optimistic</option>
<option value="Peaceful">Peaceful</option>
<option value="Pessimistic">Pessimistic</option>
<option value="Pissed off">Pissed off</option>
<option value="Pleased">Pleased</option>
<option value="Predatory">Predatory</option>
<option value="Quixotic">Quixotic</option>
<option value="Recumbent">Recumbent</option>
<option value="Refreshed">Refreshed</option>
<option value="Rejected">Rejected</option>
<option value="Rejuvenated">Rejuvenated</option>
<option value="Relaxed">Relaxed</option>
<option value="Relieved">Relieved</option>
<option value="Restless">Restless</option>
<option value="Rushed">Rushed</option>
<option value="Sad">Sad</option>
<option value="Satisfied">Satisfied</option>
<option value="Shocked">Shocked</option>
<option value="Sick">Sick</option>
<option value="Silly">Silly</option>
<option value="Sleepy">Sleepy</option>
<option value="Smart">Smart</option>
<option value="Stressed">Stressed</option>
<option value="Surprised">Surprised</option>
<option value="Sympathetic">Sympathetic</option>
<option value="Thankful">Thankful</option>
<option value="Tired">Tired</option>
<option value="Touched">Touched</option>
<option value="Uncomfortable">Uncomfortable</option>
<option value="Weird">Weird</option>
</select><input class="button" onClick="setmood();" value="Enter" type="button">
</form>
<div id='mood'></div>

 

The first bit works fine, i can type in a "status" click update and it will update the database and output a msg underneath it saying "status updated successfully".

 

But the second bit (with the dropdown list) doesnt work atall.

i have uncommented the bit to display what its sending to the database so that i can see whats happening, but all its showing is "[object HTMLDivElement]" rather then whats selected from the dropdown list.

can someone please help me sort out this code so that both bits will work as there meant to

 

thanks

Rich

[soak]

lines 82 and 83:

var status = document.getElementById('mymood').value;
var queryString = "?mood=" + mood;

 

should be:

 

var mood = document.getElementById('mymood').value;
var queryString = "?mood=" + mood;

[richarro1234]

oh man, cant beleive i missed that lol. thanks for pointing that out,

but for some reason it doesnt update the database.

[soak]

Could the problem be in mood.php?

 

I would recommend jquery for your next project. It makes ajax incredibly easy, each function you have there could probably have been done with 1 line of code.

[richarro1234]

well mood is copied exactly the same as it is in status.php.

here is the contents though:

<?php
$dbhost = "localhost";
$dbuser = "xxxxx";
$dbpass = "xxxxx";
$dbname = "social";

//Connect to MySQL Server
mysql_connect($dbhost, $dbuser, $dbpass);

//Select Database
mysql_select_db($dbname) or die(mysql_error());

if (isset($_SERVER['HTTP_X_FORWARDED_FOR'])) {
$ClientIP = $_SERVER['HTTP_X_FORWARDED_FOR'];
} else {
$ClientIP = $_SERVER['REMOTE_ADDR'];
}
//$ClientHost = gethostbyaddr($ClientIP);
$ClientAgent = $_SERVER['HTTP_USER_AGENT'];
$MyTimeStamp = time();


// Retrieve data from Query String
$mood = $_GET['mood'];
$id = $r['id'];

// Escape User Input to help prevent SQL Injection
$mood = mysql_real_escape_string($mood);


//build query
$query = "UPDATE richspri_social.users SET mood = '$mood' WHERE username = '".$_COOKIE["twusername"]."'";

//Execute query

// Exit if calling directly the script file!
if ($mood != "")
{
$qry_result = mysql_query($query) or die(mysql_error());
echo "<b><font color='#FF0000'>mood Updated Successfully</font></b>";
}
else
{
echo '<b>Hacking Attempt!!</b><br><br>';
}
?>

 

i was looking at jquery but couldnt see anything that looked like what i needed, all i saw was making things LOOK better rather then updating stuff.

 

Thanks

Rich

[deth4uall]

I am using jQuery right now, it pulls up a page into a DIV in less than 10 lines of code...

[richarro1234]

could u send me a link to a website where i can get such information please so that i can use it for my site?

 

Thanks

Rich

[xtopolis]

http://docs.jquery.com/Tutorials

 

Before you dive right in and get comfortable with jQuery, I just want you to know that it is "javascript in convenient form".  the creator and team have done an excellent job make cross browser compatible functions as well as nifty effects and an easy ajax api.  However, I read the book by the creator ("Pro Javascript Techniques") and it's basically built on tools you could create yourself.  A solid understanding of javascript will be as equally beneficial as using jQuery