Question

I have multiple options like this :

<li>
<a href="#" title="" class="selected"><span class="to-admin">Administrator</span></a>
<input id="shareto" type="hidden" value="0-1" name="shareto">
</li>
<li>
<a href="#" title=""><span class="to-finance">Finance</span></a>
<input id="shareto" type="hidden" value="1-1" name="shareto">
</li>
<li>
<a href="#" title=""><span class="to-technician">Technician</span></a>
<input id="shareto" type="hidden" value="1-0" name="shareto">
</li>
<li>
<a href="#" title=""><span class="to-lawyer">Legal</span></a>
<input id="shareto" type="hidden" value="0-0" name="shareto">
</li>

and now I want to ‘catch’ that variable using this PHP :

$Type = $_POST['shareto'];

why I always get the last value, no matter what option I choose? how to do it correctly? thanks before.

Answer 1

Please check this working fiddle link http://jsfiddle.net/7GHug/

I think you want something like this.

<ul>
<li data-val="0-1">
<a href="#" title="" class="selected"><span class="to-admin">Administrator</span></a>

</li>
<li data-val="1-1">
<a href="#" title=""><span class="to-finance">Finance</span></a>

</li>
<li data-val="1-0">
<a href="#" title=""><span class="to-technician">Technician</span></a>
</li>
<li data-val="0-0">
<a href="#" title=""><span class="to-lawyer">Legal</span></a>
<input id="shareto" type="hidden" value="" name="shareto">
</li>
</ul>​

Javascritp

$(document).ready(function($) {
        $('ul li').on('click', function() {
            $('input#shareto').val($(this).data('val'));
        });
    });

With single hidden input you can update the value based on the clicked li.
​