Jump to content

PHP / JavaScript Quandary *** PLEASE HELP


davidfattore

Recommended Posts

Ok so I'm assuming it's staring me in the face but I currently have a scripting dilemma, which I need help with... Now before I get into it, I should inform you that the code itself is working perfectly; that's not the issue....

 

I have a set of users within my database all set up in thumbnail form on a page (CLICK HERE for example) 

 

The issue is for some reason, as per the code below, no matter which thumbnail I rollover my mouse over, it always displays the last user's name and not the name of the user associated with that particular thumbnail.

 

Here is the Code

<?php
include "../../mysql/db_config.php";
//SQL Query
$query = "SELECT userID, user_name, thumbnail, url FROM users WHERE city = 'Melbourne' ORDER BY order_city ASC";
$result = @mysql_query($query);
$result2 = @mysql_query($query) or die($query."<br/><br/>".mysql_error());

if ($result)
{
	// Build the Output Section Here
$output = '';
while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
	$uid = $row ["userID"];	
	$user = $row["user_name"];
	$url = $row["url"];
	$thumb = '<img src="' . $row["thumbnail"] . '" class="thumb" onmouseover="setUser()" onmouseout="removeUser()" </img>';

/*///////////////////////////////////////////////////////////////////////////////////////////
//								SET UP USER DISPLAY MECHANISM                         //
///////////////////////////////////////////////////////////////////////////////////////////*/
$output .=
    '<div id="user_grid" class="user-grid"><a href="'. $url .'">' . $thumb . '</a></div>';
}
}
else {
    echo "Could not run query";
    exit();
}

?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="shortcut icon" type="image/x-icon" href="../assets/icons/icon.ico">
<link rel="apple-touch-icon" href="../assets/icons/apple-touch-icon.png" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.4.4.min.js'></script>
<SCRIPT LANGUAGE="JavaScript">
    function setUser()
    {
        document.getElementById("user_label").innerHTML='<?php print $user ?>';
    }
    function removeUser()
    {
        document.getElementById("user_label").innerHTML='';
    }
  </SCRIPT>     

 Any help of solving this would be appreciated...

Thanks for your time!

Link to comment
https://forums.phpfreaks.com/topic/288031-php-javascript-quandary-please-help/
Share on other sites

because you have hard coded the last users name here

    function setUser()
    {
        document.getElementById("user_label").innerHTML='<?php print $user ?>';
    }

$user will always be the very last user defined in white loop.

 

Instead what you need to do is pass the users name to the setUser javascript function for the onmouseover event. Eg

$thumb = '<img src="' . $row["thumbnail"] . '" class="thumb" onmouseover="setUser(\''.htmlspecialchars($user).'\')" onmouseout="removeUser()" </img>';

Now change the setUser javascript function to

    function setUser(name)
    {
        document.getElementById("user_label").innerHTML = name;
    }

When hovering over the users thumbnail, it should display the associated username.

@Ch0cu3r Thank you so much, I knew it had to be something trivial that I've obviously overlooked.

 

Mate I'm not sure you know how much you've helped... I was without sleep for a good 24 hours consuming a boatload of coffee over that! LOL

 

Again Thanks so much!

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.