下拉多选框提交所有值问题

我要做的一个功能，就是一开始就是提交下拉多选框里所有的值，如图：

如图，右边下拉框里所有的值全部要提交，而且还要按当前顺序提交不能打乱顺序，所以我本来是用的隐藏的radio选中获取值的，可是那样提交的值是按照id 的顺序来的，不是选择的顺序，不和需求，所以不可以。
后来在网上搜索，写JS
在页面离开之前，选中右边下拉框里所有的值。
$($(".tab").find("option[value!='-1']")).attr("selected",true);
可是发现这样还是有问题，因为这是一个登记页面，还有其他项需要到数据库里遍历数据，所以有可能不知道什么时候就离开页面了，在那个时候，值是提交不上去的，我也不知道是什么情况。只有在提交的时候才有效果，确实选中了所有。
不知道各位有没有更好的办法，或者是写过类似的功能，能给我看看吗？

解决了。确实是在提交的时候加了选中所有的js，然后还在其他离开事件里也加了，这样就不管什么情况数据都在。

每次添加一项就立刻提交到服务器

给表单添加onsubmit事件，js设置右边的option全部选中后再提交

<br> function selectAll(f) {<br> for (var i = 0; i &lt; f.role.options.length; i++) f.role.options[i].selected = true;<br> }<br>

123 4

 <script>
    function selectAll(f) {
        for (var i = 0; i < f.role.options.length; i++) f.role.options[i].selected = true;
    }
</script>
<form onsubmit="selectAll(this)">
    <select id="sel" multiple name="role">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
    </select><input type="submit" />
</form>