0

I'm trying to make on every mouseoverover event have hidden value updated with #id

My source:

#html
<li><a href="javascript:void(0)" onmouseover="set_mouseover('1')"></a></li>
<li><a href="javascript:void(0)" onmouseover="set_mouseover('2')"></a></li>
<li><a href="javascript:void(0)" onmouseover="set_mouseover('3')"></a></li>
<li><a href="javascript:void(0)" onmouseover="set_mouseover('4')"></a></li>

...

<input type="hidden" name="mouseover_cell_id" id="mouseover_cell_id" value="">

#code
function set_mouseover(id) {
  jQuery('#mouseover_cell_id').val(id);
}

and the code above doesn't work. Any idea why? Why onmouseover even doesn't set value?

Alex F
  • 183
  • 2
  • 14

3 Answers3

2
  1. Check whether you have included jquery lib file,
  2. Check whether you added the function set_mouseover(id) inside <script> tag.

function set_mouseover(id) {
  jQuery('#mouseover_cell_id').val(id);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<li><a href="javascript:void(0)" onmouseover="set_mouseover('1')">1</a></li>
<li><a href="javascript:void(0)" onmouseover="set_mouseover('2')">2</a></li>
<li><a href="javascript:void(0)" onmouseover="set_mouseover('3')">3</a></li>
<li><a href="javascript:void(0)" onmouseover="set_mouseover('4')">4</a></li>

<input type="text" name="mouseover_cell_id" id="mouseover_cell_id" value="">

Still if you have issues post console error

Anto S
  • 2,448
  • 6
  • 32
  • 50
2

try this

#html
<li><a href="javascript:void(0)" onmouseover="set_mouseover('1')"></a></li>
<li><a href="javascript:void(0)" onmouseover="set_mouseover('2')"></a></li>
<li><a href="javascript:void(0)" onmouseover="set_mouseover('3')"></a></li>
<li><a href="javascript:void(0)" onmouseover="set_mouseover('4')"></a></li>

...

<input type="hidden" name="mouseover_cell_id" id="mouseover_cell_id" value="">

#code
function set_mouseover(id) {
  document.getElementById('mouseover_cell_id').value=id;
}

this will work thanks ):

Jayram Prajapati
  • 384
  • 1
  • 8
  • what you want to know in details or what is issue for this ? – Jayram Prajapati Dec 30 '15 at 09:06
  • I don't understand why you replaced `jQuery` with `document`. That seems like you diverting a lot from the original question. What are those calls? Shouldn't I use jQuery? Is it bad? Is what you're doing better? If so, how/why? – rene Dec 30 '15 at 09:50
  • in the question everthing seems correct but it still not working may be because of the jquery ( he not attach that ) so i give you global solution to use document , there is no reason that jQuery is bad , or not need to use but according to condition i suggest him – Jayram Prajapati Dec 30 '15 at 10:08
  • Great, you better elaborate in your answer about that reasoning because *Try this `code blob`* is not the type of answers that will help future visitors to learn how to fish. Read [this](http://meta.stackoverflow.com/q/256359/578411) to understand why I'm pushing you. Notice how the consensus is to down vote these answers. – rene Dec 30 '15 at 10:14
  • np sir i am new in stack overflow but i am sure i am help people with their issue and i also learn the rule of this site – Jayram Prajapati Dec 30 '15 at 10:46
2

I would suggest using pure JavaScript, and also if you don't want the anchor tags to go anywhere maybe just use span tags. It might also be that because there is nothing in the anchor tags they have no width or height and therefor cant be hovered over.

Code:

<style type="text/css">
    li > span {
        width: 50px;
        Height: 50px;
    }
</style>
<script type="text/javascript">
    function set_mouseover(id) {
        document.getElementById("mouseover_cell_id").value = id;
    }
</script>
<li><span onmouseover="set_mouseover(1);"></span></li>

Hope this helped.

K. Bishop
  • 72
  • 6