views:

118

answers:

2

I have a table with 3 x 3 cells. Each cell contains a button, in 1-9 when click on any button, the value will be appended to an input textbox.

I tried to trigger the onmouseout event in the table but not work. and I also tried to add a div outside the table, and capture the onmouseout event.

How to use javascript to trigger that weather the client cursor is still over the table?

What I want is after the user click something in the buttons and the mouse leave the table, I need to validate what the client click-ed.

A: 

If you set the OnMouseout event on the table it will be triggered when you move the cursor over an object within the table since the cursor is no longer over the table directly.

I'm not sure what you want to do here. Do you want to raise an event when you click a button or do you want to raise an event when the cursor moves outside the table?

Edit:
The following code will raise an event every time a button is clicked.
The myClickEvent function will know which button was clicked:

<html>
  <head>
    <script>
      function myClickEvent(obj) {
         document.getElementById("myTextBox").value += obj.value;
      }
    </script>
  </head>
  <body>
    <table>
      <tr>
        <td><input type="button" value="1" onClick="myClickEvent(this);"></input></td>
        <td><input type="button" value="2" onClick="myClickEvent(this);"></input></td>
        <td><input type="button" value="3" onClick="myClickEvent(this);"></input></td>
      </tr>
      <tr>
        <td><input type="button" value="4" onClick="myClickEvent(this);"></input></td>
        <td><input type="button" value="5" onClick="myClickEvent(this);"></input></td>
        <td><input type="button" value="6" onClick="myClickEvent(this);"></input></td>
      </tr>
      <tr>
        <td><input type="button" value="7" onClick="myClickEvent(this);"></input></td>
        <td><input type="button" value="8" onClick="myClickEvent(this);"></input></td>
        <td><input type="button" value="9" onClick="myClickEvent(this);"></input></td>
      </tr>
    </table>
    <input type="text" id="myTextBox"></input>
  </body>
</html>
Sani Huttunen
What I want is after the user click something in the buttons and the mouse leave the table, I need to validate what the client click-ed.
Jay
"I need to validate what the client clicked". What do you mean by this? Please provide some more info in your question.
rahul
Why do you not want to "validate" what the client clicked WHEN he clicks a button?
Sani Huttunen
For the confirm password input, I don't want to show invalid when the client starts the first click, but show after the client FINISHED the clicks. Show I need to trigger the event when the mouse leave the keypad area(table here).
Jay
Why not add another button for the user to click to validate the password?
Sani Huttunen
Don't you think your suggestion is not user friendly?
Jay
On the contrary, userfriendlieness is more about the letting the user decide what to do. If you accidently moves the mouse pointer outside the table before he has typed in the whole password it will give him an error message and that would irritate atleast me. I want to type in my password then send a request to validate the input.
Sani Huttunen
A: 

try to add onmouseout event for the control that you want to validate and also you can use hover css style to solve that.

Vinay Pandey