Don't like ads? PRO users don't see any ads ;-)
Guest

Untitled

By: a guest on May 17th, 2012  |  syntax: None  |  size: 2.03 KB  |  hits: 23  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. Copy selection from one select field to many other select fields with jQuery?
  2. <select class="offer_1 value_source" name="xnamex">
  3.     <option value="">Please Select</option>
  4.     <option value="xxxxxxx">Text</option>
  5. </select>
  6. <button class="copy_select offer_1" type="button" name="Copy" value="">Copy Down</button>
  7. <select class="offer_1" name="xnamex">
  8.     <option value="">Please Select</option>
  9.     <option value="xxxxxxx">Text</option>
  10. </select>
  11. <!-- unknown quantity of selects follow -->
  12.        
  13. $(document).ready(function() {
  14.     $('.copy_select').click(function() {
  15.         attr_class = $(this).attr('class');
  16.         attr_class = attr_class.replace('copy_select ', '.');
  17.         $(attr_class).val($(attr_class + ' value_source').val());
  18.         alert(attr_class);
  19.     });
  20. });
  21.        
  22. $('.copy_select').click(function() {
  23.     $selects = $($(this).data('selects'));
  24.     $source = $selects.filter('.value_source');
  25.     $copies = $selects.not('.value_source');
  26.     console.log($selects);
  27.     console.log($source);
  28.     console.log($copies);
  29.     console.log($source.val());
  30.     $copies.val($source.val());
  31. })
  32.        
  33. <select class="offer_1 value_source" name="xnamex">
  34.     <option value="">Please Select</option>
  35.     <option value="a">Text</option>
  36.     <option value="b">Foo</option>
  37.     <option value="c">Bar</option>
  38. </select>
  39. <button class="copy_select" data-selects='.offer_1' type="button" name="Copy" value="">Copy Down</button>
  40. <select class="offer_1" name="xnamex">
  41.     <option value="">Please Select</option>
  42.     <option value="a">Text</option>
  43.     <option value="b">Foo</option>
  44.     <option value="c">Bar</option>
  45. </select>
  46.        
  47. $(".copy_select").click(function() {
  48.     $("select[class^='offer_']").val($(this).prev().val());
  49. });
  50.        
  51. $(document).ready(function() {
  52.   $(".copy_select").click(function() {
  53.     // store value
  54.     var v =  $( ".value_source option:selected" ).val();
  55.     // store text
  56.     var t =  $( ".value_source option:selected" ).text();
  57.     $("select[class^='offer_']").append(
  58.          "<option value="" + v + "">" + t + "</option>"
  59.     );
  60.   });
  61. });