##// END OF EJS Templates
Adds 2 buttons to easily reorder selected columns (#4272)....
Jean-Philippe Lang -
r2992:4c2264ee42ec
parent child
Show More
@@ -1,22 +1,26
1 1 <table style="border-collapse: collapse; border:0;">
2 2 <tr>
3 3 <td style="padding-left:0"><%= select_tag 'available_columns',
4 4 options_for_select((query.available_columns - query.columns).collect {|column| [column.caption, column.name]}),
5 5 :multiple => true, :size => 10, :style => "width:150px" %>
6 6 </td>
7 7 <td align="center" valign="middle">
8 <input type="button" value="--&gt;"
8 <input type="button" value="&#8594;"
9 9 onclick="moveOptions(this.form.available_columns, this.form.selected_columns);" /><br />
10 <input type="button" value="&lt;--"
10 <input type="button" value="&#8592;"
11 11 onclick="moveOptions(this.form.selected_columns, this.form.available_columns);" />
12 12 </td>
13 13 <td><%= select_tag 'query[column_names][]',
14 14 options_for_select(query.columns.collect {|column| [column.caption, column.name]}),
15 15 :id => 'selected_columns', :multiple => true, :size => 10, :style => "width:150px" %>
16 16 </td>
17 <td align="center" valign="middle">
18 <input type="button" value="&#8593;" onclick="moveOptionUp(this.form.selected_columns);" /><br />
19 <input type="button" value="&#8595;" onclick="moveOptionDown(this.form.selected_columns);" />
20 </td>
17 21 </tr>
18 22 </table>
19 23
20 24 <% content_for :header_tags do %>
21 25 <%= javascript_include_tag 'select_list_move' %>
22 26 <% end %>
@@ -1,55 +1,82
1 1 var NS4 = (navigator.appName == "Netscape" && parseInt(navigator.appVersion) < 5);
2 2
3 3 function addOption(theSel, theText, theValue)
4 4 {
5 5 var newOpt = new Option(theText, theValue);
6 6 var selLength = theSel.length;
7 7 theSel.options[selLength] = newOpt;
8 8 }
9 9
10 function swapOptions(theSel, index1, index2)
11 {
12 var text, value;
13 text = theSel.options[index1].text;
14 value = theSel.options[index1].value;
15 theSel.options[index1].text = theSel.options[index2].text;
16 theSel.options[index1].value = theSel.options[index2].value;
17 theSel.options[index2].text = text;
18 theSel.options[index2].value = value;
19 }
20
10 21 function deleteOption(theSel, theIndex)
11 22 {
12 23 var selLength = theSel.length;
13 24 if(selLength>0)
14 25 {
15 26 theSel.options[theIndex] = null;
16 27 }
17 28 }
18 29
19 30 function moveOptions(theSelFrom, theSelTo)
20 31 {
21 32
22 33 var selLength = theSelFrom.length;
23 34 var selectedText = new Array();
24 35 var selectedValues = new Array();
25 36 var selectedCount = 0;
26 37
27 38 var i;
28 39
29 40 for(i=selLength-1; i>=0; i--)
30 41 {
31 42 if(theSelFrom.options[i].selected)
32 43 {
33 44 selectedText[selectedCount] = theSelFrom.options[i].text;
34 45 selectedValues[selectedCount] = theSelFrom.options[i].value;
35 46 deleteOption(theSelFrom, i);
36 47 selectedCount++;
37 48 }
38 49 }
39 50
40 51 for(i=selectedCount-1; i>=0; i--)
41 52 {
42 53 addOption(theSelTo, selectedText[i], selectedValues[i]);
43 54 }
44 55
45 56 if(NS4) history.go(0);
46 57 }
47 58
59 function moveOptionUp(theSel) {
60 var index = theSel.selectedIndex;
61 if (index > 0) {
62 swapOptions(theSel, index-1, index);
63 theSel.selectedIndex = index-1;
64 }
65 }
66
67 function moveOptionDown(theSel) {
68 var index = theSel.selectedIndex;
69 if (index < theSel.length - 1) {
70 swapOptions(theSel, index, index+1);
71 theSel.selectedIndex = index+1;
72 }
73 }
74
48 75 function selectAllOptions(id)
49 76 {
50 77 var select = $(id);
51 78 for (var i=0; i<select.options.length; i++) {
52 79 select.options[i].selected = true;
53 80 }
54 81 }
55 82
General Comments 0
You need to be logged in to leave comments. Login now