列表框中使用js来时行移动的事例,取自sugarCRM,在asp.net中应用以减少刷新

<script language="javascript">
var object_refs = new Object();

function buildSelectHTML(info)
{
var text;
text = "<select";

if ( typeof (info['select']['size']) != 'undefined')
{
text +=" size=\""+ info['select']['size'] +"\"";
}

if ( typeof (info['select']['name']) != 'undefined')
{
text +=" name=\""+ info['select']['name'] +"\"";
}

if ( typeof (info['select']['style']) != 'undefined')
{
text +=" style=\""+ info['select']['style'] +"\"";
}

if ( typeof (info['select']['onchange']) != 'undefined')
{
text +=" onChange=\""+ info['select']['onchange'] +"\"";
}

if ( typeof (info['select']['multiple']) != 'undefined')
{
text +=" multiple";
}
text +=">";

for(i=0; i<info['options'].length;i++)
{
option = info['options'][i];
text += "<option value=\""+option['value']+"\" ";
if ( typeof (option['selected']) != 'undefined' && option['selected']== true)
{
text += "SELECTED";
}
text += ">"+option['text']+"</option>";
}
text += "</select>";
return text;
}

function left_to_right(left_name,right_name)
{
var display_columns_ref = object_refs[left_name];
//alert(display_columns_ref);
var hidden_columns_ref = object_refs[right_name];

var left_td = document.getElementById(left_name+'_td');
var right_td = document.getElementById(right_name+'_td');

var selected_left = new Array();
var notselected_left = new Array();
var notselected_right = new Array();

var left_array = new Array();

// determine which options are selected in left
for (i=0; i < display_columns_ref.options.length; i++)
{
if ( display_columns_ref.options[i].selected == true)
{
selected_left[selected_left.length] = {text: display_columns_ref.options[i].text, value: display_columns_ref.options[i].value};
}
else
{
notselected_left[notselected_left.length] = {text: display_columns_ref.options[i].text, value: display_columns_ref.options[i].value};
}

}

for (i=0; i < hidden_columns_ref.options.length; i++)
{
notselected_right[notselected_right.length] = {text:hidden_columns_ref.options[i].text, value:hidden_columns_ref.options[i].value};

}

var left_select_html_info = new Object();
var left_options = new Array();
var left_select = new Object();

left_select['name'] = left_name+'[]';
left_select['id'] = left_name;
left_select['size'] = '10';
left_select['multiple'] = 'true';

var right_select_html_info = new Object();
var right_options = new Array();
var right_select = new Object();

right_select['name'] = right_name+'[]';
right_select['id'] = right_name;
right_select['size'] = '10';
right_select['multiple'] = 'true';

for (i=0;i < notselected_right.length;i++)
{
right_options[right_options.length] = notselected_right[i];
}

for (i=0;i < selected_left.length;i++)
{
right_options[right_options.length] = selected_left[i];
}
for (i=0;i < notselected_left.length;i++)
{
left_options[left_options.length] = notselected_left[i];
}
left_select_html_info['options'] = left_options;
left_select_html_info['select'] = left_select;
right_select_html_info['options'] = right_options;
right_select_html_info['select'] = right_select;
right_select_html_info['style'] = 'background: lightgrey';

var left_html = buildSelectHTML(left_select_html_info);
var right_html = buildSelectHTML(right_select_html_info);

left_td.innerHTML = left_html;
right_td.innerHTML = right_html;
object_refs[left_name] = left_td.getElementsByTagName('select')[0];
object_refs[right_name] = right_td.getElementsByTagName('select')[0];
}

function right_to_left(left_name,right_name)
{
var display_columns_ref = object_refs[left_name];
var hidden_columns_ref = object_refs[right_name];

var left_td = document.getElementById(left_name+'_td');
var right_td = document.getElementById(right_name+'_td');

var selected_right = new Array();
var notselected_right = new Array();
var notselected_left = new Array();

for (i=0; i < hidden_columns_ref.options.length; i++)
{
if (hidden_columns_ref.options[i].selected == true)
{
selected_right[selected_right.length] = {text:hidden_columns_ref.options[i].text, value:hidden_columns_ref.options[i].value};
}
else
{
notselected_right[notselected_right.length] = {text:hidden_columns_ref.options[i].text, value:hidden_columns_ref.options[i].value};
}

}

for (i=0; i < display_columns_ref.options.length; i++)
{
notselected_left[notselected_left.length] = {text:display_columns_ref.options[i].text, value:display_columns_ref.options[i].value};

}

var left_select_html_info = new Object();
var left_options = new Array();
var left_select = new Object();

left_select['name'] = left_name+'[]';
left_select['id'] = left_name;
left_select['multiple'] = 'true';
left_select['size'] = '10';

var right_select_html_info = new Object();
var right_options = new Array();
var right_select = new Object();

right_select['name'] = right_name+ '[]';
right_select['id'] = right_name;
right_select['multiple'] = 'true';
right_select['size'] = '10';

for (i=0;i < notselected_left.length;i++)
{
left_options[left_options.length] = notselected_left[i];
}

for (i=0;i < selected_right.length;i++)
{
left_options[left_options.length] = selected_right[i];
}
for (i=0;i < notselected_right.length;i++)
{
right_options[right_options.length] = notselected_right[i];
}
left_select_html_info['options'] = left_options;
left_select_html_info['select'] = left_select;
right_select_html_info['options'] = right_options;
right_select_html_info['select'] = right_select;
right_select_html_info['style'] = 'background: lightgrey';

var left_html = buildSelectHTML(left_select_html_info);
var right_html = buildSelectHTML(right_select_html_info);

left_td.innerHTML = left_html;
right_td.innerHTML = right_html;
object_refs[left_name] = left_td.getElementsByTagName('select')[0];
object_refs[right_name] = right_td.getElementsByTagName('select')[0];
}

function up(name) {
var td = document.getElementById(name+'_td');
var obj = td.getElementsByTagName('select')[0];
obj = (typeof obj == "string") ? document.getElementById(obj) : obj;
if (obj.tagName.toLowerCase() != "select" && obj.length < 2)
return false;
var sel = new Array();

for (i=0; i<obj.length; i++) {
if (obj[i].selected == true) {
sel[sel.length] = i;
}
}
for (i in sel) {
if (sel[i] != 0 && !obj[sel[i]-1].selected) {
var tmp = new Array(obj[sel[i]-1].text, obj[sel[i]-1].value);
obj[sel[i]-1].text = obj[sel[i]].text;
obj[sel[i]-1].value = obj[sel[i]].value;
obj[sel[i]].text = tmp[0];
obj[sel[i]].value = tmp[1];
obj[sel[i]-1].selected = true;
obj[sel[i]].selected = false;
}
}
}

function down(name) {
var td = document.getElementById(name+'_td');
var obj = td.getElementsByTagName('select')[0];
if (obj.tagName.toLowerCase() != "select" && obj.length < 2)
return false;
var sel = new Array();
for (i=obj.length-1; i>-1; i--) {
if (obj[i].selected == true) {
sel[sel.length] = i;
}
}
for (i in sel) {
if (sel[i] != obj.length-1 && !obj[sel[i]+1].selected) {
var tmp = new Array(obj[sel[i]+1].text, obj[sel[i]+1].value);
obj[sel[i]+1].text = obj[sel[i]].text;
obj[sel[i]+1].value = obj[sel[i]].value;
obj[sel[i]].text = tmp[0];
obj[sel[i]].value = tmp[1];
obj[sel[i]+1].selected = true;
obj[sel[i]].selected = false;
}
}
}

</script>