Accidergiedotre
New Member
I have two(named as box1,box2) multiple selected forms and two buttons add/remove in between as designed.Box1 one will have items a,b,c,d,e with values 1,2,3,4,5.I have written the code for adding and removing.Now when i add a,b,c,d to box2 from box1 then i need to get the sum of all the items to be displayed i.e 10, when i remove from box2 one item i.e b then it should show me 8.I want to do it using jquery and css.Kindly help me out or any tutorials are encouraged.I am just a beginner so help me out.thank you 
I tried this\[code\]<script>$(document).ready(function() { $('#btn-add').click(function(){ $('#select-from option:selected').each( function() { $('#select-to').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>"); }); }); $('#btn-remove').click(function(){ $('#select-to option:selected').each( function() { $(this).remove(); }); });});</script></head><body><form> <fieldset> <select name="selectfrom" id="select-from" multiple size="5"> <option value="http://stackoverflow.com/questions/14454770/1">Item 1</option> <option value="http://stackoverflow.com/questions/14454770/2">Item 2</option> <option value="http://stackoverflow.com/questions/14454770/3">Item 3</option> <option value="http://stackoverflow.com/questions/14454770/4">Item 4</option> </select> <a href="JavaScript:void(0);" id="btn-add">Add »</a> <a href="JavaScript:void(0);" id="btn-remove">« Remove</a> <select name="selectto" id="select-to" multiple size="5"> </select> </fieldset> \[/code\]
I tried this\[code\]<script>$(document).ready(function() { $('#btn-add').click(function(){ $('#select-from option:selected').each( function() { $('#select-to').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>"); }); }); $('#btn-remove').click(function(){ $('#select-to option:selected').each( function() { $(this).remove(); }); });});</script></head><body><form> <fieldset> <select name="selectfrom" id="select-from" multiple size="5"> <option value="http://stackoverflow.com/questions/14454770/1">Item 1</option> <option value="http://stackoverflow.com/questions/14454770/2">Item 2</option> <option value="http://stackoverflow.com/questions/14454770/3">Item 3</option> <option value="http://stackoverflow.com/questions/14454770/4">Item 4</option> </select> <a href="JavaScript:void(0);" id="btn-add">Add »</a> <a href="JavaScript:void(0);" id="btn-remove">« Remove</a> <select name="selectto" id="select-to" multiple size="5"> </select> </fieldset> \[/code\]