Jump to content


Check out our Community Blogs

Register and join over 40,000 other developers!


Recent Status Updates

View All Updates

Photo
- - - - -

highlight the choose name and display data without using mouse

innerHTML

  • Please log in to reply
No replies to this topic

#1 newphpcoder

newphpcoder

    CC Devotee

  • Senior Member
  • PipPipPipPipPipPip
  • 527 posts

Posted 11 December 2011 - 07:48 PM

Hi..

I don't know if it is javascript or css issue.

I have a navigation list of my employee names and when I click the name his data will display at the right side.

I used onclick for displaying data. Now my superior suggested that much better if he used key done using mouse in choosing employee name. He suggested that the employee that was choose was highlighted then automatically his data will displayed using key. like arrow down and up key. Is it possible? how?

I think should i used onkeyup?but i don't know how it is highlighted?

here is my code for displaying employee names:

search.php
<?php   
session_start();
include 'config.php';

$queryString = $_GET["query"];

if ($queryString == "" || $queryString == null) {

$sql = "SELECT EMP_ID, CONCAT(LNAME, ', ',  FNAME, ' ', MI, '.') AS FULLNAME FROM PERSONAL 
        ORDER BY FULLNAME ASC";
}
else {


$sql = "SELECT EMP_ID, CONCAT(LNAME, ', ',  FNAME, ' ', MI, '.') AS FULLNAME FROM PERSONAL WHERE CONCAT(LNAME, ', ',  FNAME, ' ', MI, '.')  LIKE '" . $queryString . "%' ORDER BY FULLNAME ASC";

}

$recPersonalQuery = $conn->Execute($sql);
if (!$recPersonalQuery->BOF) {
    $recPersonalQuery->MoveFirst();
}

echo "<hr />";
echo "<ul>";
while (!$recPersonalQuery->EOF) {
    $empID   = $recPersonalQuery->fields["EMP_ID"]; 
    $empFullName = $recPersonalQuery->fields["FULLNAME"];

  echo "<li onclick=changeEmployeePay('$empID'); style= 'font-family:'Times New Roman',Times,serif; font-size:10%;'>$empFullName</li>";
    echo "<hr />";
    $recPersonalQuery->MoveNext();
} 
echo "</ul>";

$recPersonalQuery->Close();
exit(); 

display names
<script>
function searchemppay(queryString) {
    var ajaxRequest = remoteRequestObject();
    ajaxRequest.onreadystatechange = function() {
        if (ajaxRequest.readyState == 4 && ajaxRequest.status == 200) {
            var result = ajaxRequest.responseText;
            document.getElementById('searchpayroll').innerHTML = result;
        } 
    } 
    var url = "search.php?query=" + queryString;
    ajaxRequest.open("GET", url, true);
    ajaxRequest.setRequestHeader("If-Modified-Since", "Sat, 1 Jan 2000 00:00:00 GMT");
    ajaxRequest.send(null);

}

function changeEmployeePay(queryID) {

window.location = "SearchData.php?queryEmpID=" + queryID;
}
</script>

<div id="Search">
<form>
<p class="serif"><b>Search Lastname:</b></p>
<input type="text" name="search_" size="20" onkeyup="searchemppay(this.value);">  
<div id="searchpayroll" style="overflow:auto; height:390px; width:auto; margin-left:2px" >
<hr />
<ul>
{section name=co_emp loop=$personalAll}
<li onclick="changeEmployeePay('{$personalAll[co_emp].EMP_ID}')">{$personalAll[co_emp].FULLNAME}</li>
<!--<li onkeyup="changeEmployeePay('{$personalAll[co_emp].EMP_ID}')">{$personalAll[co_emp].FULLNAME}</li>-->
<hr />
{sectionelse}
<li>No records found</li>
{/section}
</ul>
</div>
</div>

If you have queation for further understanding of my thread feel free to ask me..

Any help is highly appreciated.

Thank you so much
  • 0





Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download