用SwapSelect在view中管理一对多关联

在视图中建立一对象与已经存在的多个对象的关联比较麻烦。
在select-box中设置 multiple => true可以实现，但是如果选项太多的话，上下翻起来很麻烦。
或者用一堆的check_box。也不方便。
在
http://trendwork.kmf.de/26/swapselect-a-better-way-for-multiple-select-in-rails/
发现了SwapSelect
这个SwapSelect有左右两个选择框，从左边的框中选中到右边的框，提交就可以了。
只是目前还存在一些问题：
1.没有做成plugin，要将各文件拷到相应的位置；
2.有时不进行选择时会有问题，随便左右移动一下就好了；
3.选择框中什么都没有时，框会很窄，比较难看；
4.IE中显示有问题，在swapselect.css中改一下width:40%;就好了。

div.swap_select .swap_select_select {
	float:left;
	width:40%;
}

中文嘛，在swapselect.js中改一下就好了。

  this.languagesValues = new Object();
  this.languagesValues["AviableHeadline"] = "可选项";
  this.languagesValues["SelectedHeadline"] = "已选项";
  this.languagesValues["AssumeButtonTitleAttr"] = "添加";
  this.languagesValues["AssumeButtonText"] = "添加";
  this.languagesValues["AssumeAllButtonTitleAttr"] = "添加所有";
  this.languagesValues["AssumeAllButtonText"] = "添加所有";
  this.languagesValues["TakeBackButtonTitleAttr"] = "去除";
  this.languagesValues["TakeBackButtonText"] = "去除";
  this.languagesValues["TakeBackAllButtonTitleAttr"] = "去除所有";
  this.languagesValues["TakeBackAllButtonText"] = "去除所有";

中文显示时字号显得有些小，再改一下swapselect.css吧，改为font-size:12px;

div.swap_select p.swap_select_selected {
	font-size:12px;
	background-color:#EEEEEE;
	border:1px solid #CBCBCB;
	border-bottom:none;
}

用起来很简单。

评论

1 楼 yearl 2009-12-22  

没有人发表意见？
大家还有没有其它办法？